Bluesnap API-Implementierung mit Webapi2 und Jquery

Question

Ich bekomme immer Authentifizierung erforderlich Fenster. wenn ich die URL der blauen Snap-Sandbox anrufe. Ich habe gegoogelt und einen Artikel gelesen, der sagt, dass wegen CORS das Meldungsfeld Authentifizierung erforderlich erscheint. Ich habe versucht, die Basis-Authentifizierung im Header selbst hinzuzufügen, aber kein Glück.

JS-Code

$(document).ready(function() { 
    $('#paymentsubmit').click(function(e) { 
     xmlstring = 
      "<?xml version='1.0'?>" + 
      "<card-transaction xmlns='http://ws.plimus.com'>" + 
      "<card-transaction-type>AUTH_ONLY</card-transaction-type>" + 
      "<recurring-transaction>ECOMMERCE</recurring-transaction>" + 
      "<soft-descriptor>DescTest</soft-descriptor>" + 
      "<amount>11.00</amount>" + 
      "<currency>USD</currency>" + 
      "<card-holder-info>" + 
      "<first-name>test first name</first-name>" + 
      "<last-name>test last name</last-name>" + 
      "</card-holder-info>" + 
      "<credit-card>" + 
      "<card-number>4263982640269299</card-number>" + 
      "<security-code>837</security-code>" + 
      "<expiration-month>02</expiration-month>" + 
      "<expiration-year>2018</expiration-year>" + 
      "</credit-card>" + 
      "</card-transaction>"; 

     $.ajax({ 
      data: xmlstring, 
      Authorization: "Basic " + btoa("API_14655582321891175640599" + ":" + "Aut0mat!c"), 
      dataType: 'jsonp', 
      xhrFields: { 
       withCredentials: true 
      }, 
      contentType: 'application/xml', 
      bluesnapversion: '2.0', 
      type: 'POST', 
      // beforeSend: function (xhr) { xhr.setRequestHeader('Authorization', 'Basic ' + btoa('API_14655582321891175640599' + ':' + 'Aut0mat!c')); }, 
      url: 'https://sandbox.bluesnap.com/services/2/transactions' 

     }).done(function(data) { 
      alert('Registered Successfully'); 
     }).error(function(jqXHR, textStatus, errorThrown) { 
      alert(jqXHR.responseText || textStatus); 
     }) 
    }); 
}); 

Answer 1

Nach den wenigen Tagen der Forschung, die wir gefunden haben, dass diese bluesnap Implementierung nicht von der Client-Seite arbeiten direkt (Erste einige CORS Probleme auch nach dem alle notwendigen Header hinzufügen und andere Sachen). Also haben wir versucht, die BlueSnap API vom serverseitigen Controller aus aufzurufen.

-Controller

[EnableCors(origins: "http://localhost:49369", headers: "*", methods: "*", exposedHeaders: "X-Custom-Header")] 

    public class BlueSnapController : ApiController 
    { 
     [ActionName("PostBlueSnapData")] 
     [HttpPost] 
     public IHttpActionResult PostBlueSnapData(UtilityModels bluesnapmodels) 
     { 
      string responseFromServer = string.Empty; 
      try 
      { 
       // Create a request using a URL that can receive a post. 
       HttpWebRequest request = (HttpWebRequest)WebRequest.Create("https://sandbox.bluesnap.com/services/2/transactions"); 
       // Set the Method property of the request to POST. 
       request.Method = "POST"; 
       request.Headers["Authorization"] = "Basic QVBJ&zE0NjU1NTgyNzIxODkxMTc1NjQwNTk5OkF1dDBtYXQhYw=="; 
       request.UserAgent = ".NET Framework Test Client"; 
       string postData = bluesnapmodels.XMLData; 
       byte[] byteArray = Encoding.UTF8.GetBytes(postData); 
       request.ContentType = "application/xml"; 
       request.ContentLength = byteArray.Length; 
       Stream dataStream = request.GetRequestStream(); 
       dataStream.Write(byteArray, 0, byteArray.Length); 
       dataStream.Close(); 

       // Get the response. 

       HttpWebResponse myHttpWebResponse = (HttpWebResponse)request.GetResponse(); 
       Console.WriteLine((myHttpWebResponse.StatusDescription)); 
       dataStream = myHttpWebResponse.GetResponseStream(); 
       StreamReader reader = new StreamReader(dataStream); 
       responseFromServer = reader.ReadToEnd(); 
       Console.WriteLine(responseFromServer); 
       reader.Close(); 
       dataStream.Close(); 
       myHttpWebResponse.Close(); 
      } 
      catch (WebException wex) 
      { 
       var pageContent = new StreamReader(wex.Response.GetResponseStream()) 
             .ReadToEnd(); 

       Console.WriteLine(wex.Message); 
      } 


      return Ok(responseFromServer); 

     } 


    } 

Anruf Ajax

<script> 
$(document).ready(function() { 

    $('#paymentsubmit').click(function (e) { 

     var xmlstring = 
     "<?xml version='1.0'?>" + 
        "<card-transaction xmlns='http://ws.plimus.com'>" + 
        "<card-transaction-type>AUTH_ONLY</card-transaction-type>" + 
        "<recurring-transaction>ECOMMERCE</recurring-transaction>" + 
        "<soft-descriptor>DescTest</soft-descriptor>" + 
        "<amount>11.00</amount>" + 
        "<currency>USD</currency>" + 
        "<card-holder-info>" + 
         "<first-name>test1 first name</first-name>" + 
         "<last-name>test1 last name</last-name>" + 
         "</card-holder-info>" + 
         "<credit-card>" + 
         "<card-number>4263982640269299</card-number>" + 
      "<security-code>837</security-code>" + 
      "<expiration-month>02</expiration-month>" + 
      "<expiration-year>2018</expiration-year>" + 
     "</credit-card>" + 
        "</card-transaction>"; 

     var blueSnapData = { 
      XMLData: xmlstring 

      } 

     $.ajax({ 
      withCredentials: true, 
      type: 'POST', 
      url: 'http://localhost:4233/api/BlueSnap/PostBlueSnapData', 
      data: blueSnapData 
     }).done(function (data) { 
      alert('Registered Successfully' + '/n'+data); 
     }).error(function (jqXHR, textStatus, errorThrown) { 
      alert(jqXHR.responseText || textStatus); 
     }) 


    }); 

}) 


</script> 

Diese Methode funktioniert gut. Ich bin gespannt, ob wir noch andere Optionen haben, die wir implementieren können.

Dank Dev