cancel
Showing results for 
Search instead for 
Did you mean: 

Not able to get the response token and consequently not able to access the accept hosted page

Hi I am working on node.js and try to call the authorize.net test api "https://test.authorize.net/payment/payment". Issue is that i am getting token but I am not understanding how to append the token to redirect to authorize.net mean to call getAnAcceptPaymentPage. I request to you help me out. Share some code so that I to proceed.

 

function getAnAcceptPaymentPage(res) {
console.log(res)
   var merchantAuthenticationType = new ApiContracts.MerchantAuthenticationType();
   merchantAuthenticationType.setName(constants.apiLoginKey);
   merchantAuthenticationType.setTransactionKey(constants.transactionKey);

   var transactionRequestType = new ApiContracts.TransactionRequestType();
   transactionRequestType.setTransactionType(ApiContracts.TransactionTypeEnum.AUTHCAPTURETRANSACTION);
   transactionRequestType.setAmount(res.amount);
    
    var setting1 = new ApiContracts.SettingType();
    setting1.setSettingName('hostedPaymentButtonOptions');
    setting1.setSettingValue('{\"text\": \"Pay\"}');

    var setting2 = new ApiContracts.SettingType();
    setting2.setSettingName('hostedPaymentOrderOptions');
setting2.setSettingValue('{\"show\": true}');
 
    var settingList = [];
    settingList.push(setting1);
settingList.push(setting2);
 
var alist =[]
alist = new ApiContracts.ArrayOfSetting();
    alist.setSetting(settingList);

    var getRequest = new ApiContracts.GetHostedPaymentPageRequest();
    getRequest.setMerchantAuthentication(merchantAuthenticationType);
    getRequest.setTransactionRequest(transactionRequestType);
    //getRequest.setHostedPaymentSettings(alist);
console.log("this ankit")
    console.log(JSON.stringify(getRequest.getJSON(), null, 2));
        return getRequest
    
}


router.post('/pay',(req,res)=>{
console.log('server called')
try{
var getRequest = getAnAcceptPaymentPage(req.body)
console.log("this getreq", getRequest)
var ctrl = new ApiControllers.GetHostedPaymentPageController(getRequest.getJSON());
console.log("this getreq1", getRequest)
ctrl.execute(function(){
var apiResponse = ctrl.getResponse();
var response = new ApiContracts.GetHostedPaymentPageResponse(apiResponse);
//pretty print response
console.log(JSON.stringify(response, null, 2));
if(response != null)
{
console.log("check1")
if(response.getMessages().getResultCode() == ApiContracts.MessageTypeEnum.OK)
{
var token = response.getToken();
console.log("this token",token)
var headers = {
"Content-Type": "application/json",
"Autherization": `${token}`
}
request.post({
"headers": headers,
"url": url,
//"auth": token
}, function(error, response) {
console.log('statusCode:', response && response.statusCode); // Print the response status code if a response was received
// if(response.statusCode != 200){
// sendError(err,{message:"Issue while calling authorize.net gateway"})
// }
//else{
sendSuccess(res,{message:"Successfully called authorize.net gateway",result:response,statuscode : response && response.statusCode})
//}
});
// sendSuccess(res,{message:"Token hass been generated to get payment page",result:response.getToken()})
 
}
 
}
 
});
}
catch(err){
sendError(err,{message:"this catch",err:err})
}
 
})


==========================================================================

Reponse:-

{

"success": true
"data": {
"message": "Successfully called authorize.net gateway"
"result": {
"statusCode": 200
"body": " <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <!-- Doesn't always work! --> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"> <link href="scripts/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"> <link href="scripts/lib/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> <script src="scripts/lib/jquery.min.js"></script> <script src="scripts/lib/angular.min.js"></script> <script src="scripts/lib/bootstrap/js/bootstrap.min.js"></script> <head id="Head1"><title> Secure Information </title> <link href="styles/payment.css" rel="stylesheet" type="text/css" /> <style type="text/css"> null </style> <script src="../payment/scripts/components/paymentComponent/1_0/payment-min.js"></script> <script src="../payment/scripts/components/addressComponent/1_0/address-min.js"></script> <script src="../payment/scripts/components/bankAccountComponent/1_0/bankAccount-min.js"></script> <script src="scripts/app-min.js"></script> <script type="text/javascript"> //<![CDATA[ var g_token = "null"; var g_merchantData = null; var g_pageOptions = null; var g_paymentProfiles = null; var g_iframeCommunicatorUrl = (!!(typeof g_pageOptions !== 'undefined' && g_pageOptions !== null && g_pageOptions.hostedPaymentIFrameCommunicatorUrl && g_pageOptions.hostedPaymentIFrameCommunicatorUrl.url)) ? g_pageOptions.hostedPaymentIFrameCommunicatorUrl.url : ""; var g_maxPaymentProfiles = false; </script> <script type="text/javascript"> var onloadCallback = function () { var scope = angular.element($('div[ng-controller="mainController"]')).scope(); grecaptcha.render('html_element', { 'sitekey': '6Lc8tgYAAAAAAFfalsuPuIZ6bv_2dGT_Y9ZxURiK', 'theme': 'light', 'callback': verifyCallback }); if (g_iframeCommunicatorUrl.length > 0 && scope.isIframeCommunication) { IFrameCommunication.sendResizeWindowToMerchant(); } }; var verifyCallback = function (response) { var scope = angular.element($('div[ng-controller="mainController"]')).scope(); scope.isValidCaptchResponse = true; scope.$apply(); }; </script> <script type="text/javascript"> var g_EcheckEnabled = false; var g_CreditEnabled = false; </script> </head> <body> <div class="PageOuter" id="divPageOuter"> <div id="divPopupScreen" class="PopupScreen" style="display:none;"></div> <div class="Page" id="divPage" ng-app="HostedPaymentApp"> <div class="PageMain container" id="divPageMain container" ng-controller="mainController" ng-cloak> <div id="MainContent_divErrorPanel" class="ErrorPanel container"> <div class="ErrorPanelMsg"> <span id="MainContent_spnErrorMsg" class="ErrorMsg">Missing or invalid token.</span> </div> <div id="divErrorPanelButtons" class="ErrorPanelButtons"> <!--<input id="btnCloseWindow" class="CloseButton" ng-click="cancelContinueBtnHandler('cancel')" value="Close" type="button"/> --> </div> </div> <div id="divIframeCommunicator" class="iFrameClass"></div> </div> <div class="PageMainAfter"></div> </div> </div> </body> </html> "
"headers": {
"cache-control": "no-cache, no-store, must-revalidate"
"pragma": "no-cache"
"content-type": "text/html; charset=utf-8"
"expires": "-1"
"x-content-type-options": "nosniff"
"content-length": "3809"
"date": "Tue, 03 Jul 2018 17:04:06 GMT"
"connection": "close"
}
 
"request": {
"uri": {
"protocol": "https:"
"slashes": true
"auth": null
"host": "test.authorize.net"
"port": 443
"hostname": "test.authorize.net"
"hash": null
"search": null
"query": null
"pathname": "/payment/payment"
"path": "/payment/payment"
}
 
"method": "POST"
"headers": {
"Content-Type": "application/json"
"Autherization": "B9KAXy5DFywHhdBgNO/OCwK8mZDXUEzkg/QazuJq69UI2Yd1n+eigOr3IILJ9JrvDpjHxX6Zf0RgTqhl+YPv5RpSaBiFIwQ2/cs2A9DdtMtQeRr7m3hkSkR02m1mnB3z4S7wG1cQMalnOPr9leMSrnIxJje/wGrCqTqJdGzmcUYzdqQ6NydLNCC10q62lZicDN2OK6q1QwTgTMDBxqok8uGZHD3R6uZTi5XyUwFFJeII4iSsdrwbfHEbosPiJk4uWND2hPFt6wulZfailJuGS9K5z+1Izk6M0QkXJhyYDTQHoLUAl6SrlhiOqbKPHwsW9tBNUtFwZfSuzmm/36shmwhuYtMf0aQ3XvK/+OEh/mBXCFNCp5UcNnZJ2HhLi1+b3CLzs3JK7TD0MHYc0nQvWdPr3rOVAz8IhqIjKdBZ+GuJC/CSJ97fzSjpOfJnm+NuVAYKLOrl7X3p9unfuCSEPumdxVGJUJ7CjJqlD1mV1LignIwhTj9FH8D/DyA37amj2S4jJMjtEGaaTrmqH1dAfbIoCUixjzVMEbi/scde5cmjZ3Lnyc6/m+w2bY5AaTv3b+A37ZD6xeoQ9CsFDqzQ+tm/w+VeK7HSVnvvZu3ln6eUhnOZmBmkA8O/6dlSnIPZ8Z/BLR1TL0EgAgrCte9Ze8DkAbuBumEsxaE4LS9Wfe/5rPhBwN5FxMmiNAMeWNM9gyhuG0fikTip2EjTVIc203Lz99NzuLtty2vX7ldfVrs=.84NfcF7L"
"content-length": 0
}
 
}
 
}
 
"statuscode": 200
}
 

}

ankit
Member
2 REPLIES 2

Hi @ankit

 

Have you see the sample app for Accept Hosted at https://github.com/AuthorizeNet/accept-sample-app

 

https://github.com/AuthorizeNet/accept-sample-app/blob/master/README-AcceptHosted.md

 

Hope it helps !!!

 

Thanks





Send feedback at developer_feedback@authorize.net
Anurag
Moderator Moderator
Moderator

Anurag already provided good suggestion, still I want to know How you are integrating.

To integrate the Accept Hosted Payment Page , Merchant can use any of the following 3 methods:- 

  • Redirect

       Merchant website can redirect to Authorize.Net Accept Hosted Payment Page

 

  •  Iframe / Authorize.Net popup

        Merchant can use Iframe / Authorize.Net popup to access the Authorize.Net Accept Hosted Payment Page

  •  Iframe/Embedded to Merchants web page

      Merchant can have embedded the Authorize.Net accept Hosted Payment Page inside   the  merchant’s webpage.

 

for First Redirect case here how you can implement:-

  1. Do a Form submit with action="https://test.authorize.net/payment/payment"

    as below.

               

     

     

    <!DOCTYPE html>
    <html>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
    <head>
    
    </head>
    <body>
        <form method="post" action="https://test.authorize.net/payment/payment" id="formAuthorizeNetTestPage" name="formAuthorizeNetTestPage">
            <input type="hidden" name="token" value="Should be replaced with FormToken" />
            Continue to Authorize.Net to Payment Page
            <button id="btnContinue">Continue to next page</button>
        </form>     
    </body>
    </html>

     

     I hope it will help.

     

    Thanks,          

Shoagraw
Authorize.Net Developer Authorize.Net Developer
Authorize.Net Developer