cancel
Showing results forย 
Search instead forย 
Did you mean:ย 

Sandbox Accept.js seems to be down

I'm getting a 550 error in the Chrome network monitor. It was working earlier today.

 

XMLHttpRequest cannot load https://apitest.authorize.net/xml/v1/request.api. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://localhost:5000' is therefore not allowed access. The response had HTTP status code 550.

 

Here's the extract Curl command

curl "https://apitest.authorize.net/xml/v1/request.api" -X OPTIONS -H "Pragma: no-cache" -H "Access-Control-Request-Method: POST" -H "Origin: https://localhost:5000" -H "Accept-Encoding: gzip, deflate, sdch, br" -H "Accept-Language: en-US,en;q=0.8" -H "User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.143 Safari/537.36" -H "Accept: */*" -H "Cache-Control: no-cache" -H "Referer: https://localhost:5000/" -H "Connection: keep-alive" -H "Access-Control-Request-Headers: content-type" --compressed

 

is also showing 550 

blackbeltdev
Contributor
17 REPLIES 17

There's 3 things I'd like to see after the service is restored:

 

1) What happened? There was some event yesterday which caused the service to stop working. If there was an update there should be better notification and smoke testing to ensure us consumers aren't affected as well as reliable rollback procedures (A/B swtich, etc.).

 

2) Add better monitoring so excessive downtime can be avoided. Also add a service dashboard (e.g. http://open.concur.com/) for greater transparency.

 

3) Make sure that the JS 'responseHandler' callback function is called from Accept.dispatchData when ANY error happens so it can be notified there was a problem. For example in our application we are displaying a busy indicator until the call returns, which it never does because it eats the exception, so our application appears stuck in a loop.

 

We also have a critical hot fix that is delayed due to this.

 

Thanks

The issue has been resolved, and HTTP OPTIONS calls should return the appropriate CORS headers. We apologize for the inconvenience.

--
"Move fast and break things," out. "Move carefully and fix what you break," in.

Our issue wasn't "accept.js" per se. It was generally that the sandbox was timing out for us suddenly. It is now working for us.


We have simply added https://jstest.authorize.net/v1/Accept.js in oue page and hit sendPaymentDataToAnet function. We have cheked if this function working or not with alert message and its working. After that we have set creditdata and authdata in secureData variable and also checked securedata variable with alert and all values set in this variable. But when it comes to execute function Accept.dispatchData(secureData, 'responseHandler'), it will give us above error i.e Uncaught TypeError: window[c] is not a function in https://jstest.authorize.net/v1/AcceptCore.js.


We haven't yet find this issue to be fixed.

Please fix this issue.

Thanks

lovey
Member

@lovely

 

There is NOT a problem right now. It sounds like a programming error on your side. I would still like answers to the 3 issues I raised however

@lovey Here's a fully functional test you can use to verify it works. All you need to do is update the apiKey/publicKey (marked TODO in the code). This MUST be served from an HTTPS server to work (e.g. I used Node.js). Visit the page and hit Pay button and you will get a nonce displayed in alert and console.

 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Payment Screen using Accept.js POC</title>
<script src="jquery.min.js"></script>
<script src="https://jstest.authorize.net/v1/Accept.js"></script>
</head>
<body>

<div class="">

<fieldset>
<fieldset>
<label for="cardNumber">Card Number</label>
<input id="cardNumber" value="370000000000002"/>

<label for="securityCode">CVV/CVD</label>
<input id="securityCode" value="900"/>
</fieldset>

<fieldset>
<legend>Card Expiration</legend>
<input id="expirationMonth" value="08" />
<label for="expirationMonth">Month</label>
<input id="expirationYear" value="2022"/>
<label for="expirationYear">Year</label>
</fieldset>

</fieldset>

<button type="submit" onclick="sendPaymentDataToAnet()">Pay</button>

</div>

<script>
'use strict';

var config = {
apiLoginID: 'TODO',
clientKey: 'TODO'
};

function sendPaymentDataToAnet() {
var secureData = {}, authData = {}, cardData = {};

cardData.cardNumber = document.getElementById('cardNumber').value;
cardData.cardCode = document.getElementById('securityCode').value;
cardData.month = document.getElementById('expirationMonth').value;
cardData.year = document.getElementById('expirationYear').value;
secureData.cardData = cardData;

authData.clientKey = config.clientKey;
authData.apiLoginID = config.apiLoginID;
secureData.authData = authData;

Accept.dispatchData(secureData, 'responseHandler');
}

function responseHandler(response) {
if (response.messages.resultCode === 'Error') {
for (var i = 0; i < response.messages.message.length; i++) {
console.log(response.messages.message[i].code + ':' + response.messages.message[i].text);
}
} else {
useOpaqueData(response.opaqueData)
}
}

function useOpaqueData(responseData) {
// This is where you would set the data descriptor & data value to be posted back to your server
console.log(responseData.dataDescriptor);
console.log(responseData.dataValue);
alert(responseData.dataValue);
}

</script>
</body>

</html>

 

I just stumbled upon this:

 

https://status.authorize.net/

 

However it is not accurate as there no mention of this outage.

Can you please comment out how responsehandler can be defined on ReactJS application

 <form id="paymentForm" method="POST" action="">
          <input type="hidden" name="dataValue" id="dataValue" />
          <input type="hidden" name="dataDescriptor" id="dataDescriptor" />
          <InputDiv id="proceed">
            <Button
              type="button"
              id="paymentButton"
              className="AcceptUI"
              data-billingAddressOptions='{"show":true, "required":false}'
              data-apiLoginID={
                process.env.REACT_APP_AUTHORIZE_NET_LOGIN_ID
              }
              data-clientKey={
                process.env.REACT_APP_AUTHORIZE_NET_TRANSITION_KEY 
              }
              data-acceptUIFormBtnTxt="Pay now"
              data-acceptUIFormHeaderTxt="Card Information"
              data-paymentOptions='{"showCreditCard": true, "showBankAccount": true}'
              data-responseHandler={(response) => {
                this.handleSendPaymentInformationToAuthorizeNet(response);
              }}
            >
              Proceed
            </Button>
          </InputDiv>
        </form>
handleSendPaymentInformationToAuthorizeNet = (response) => {
    console.log('response is', response);
  };