implement getHostedpaymentPageRequest in Javascript

furqanmajeed007 — Fri, 10 Jun 2022 15:44:09 GMT

I need to call getHostedpaymentPageRequest and generate a token using javascript with in HTML. I am using authorize.net provided code to display the form. But i need to generate token and pass the token information to my payment page. there is no example of javascript code on their webiste to generate the token. https://developer.authorize.net/api/reference/index.html#accept-suite-get-an-accept-payment-page

Here is my code:

<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<head>
<title>HostedPayment Test Page</title>

<script src="scripts/lib/jquery.min.js"></script>
<script type="text/javascript">

$(function () {

$("#btnOpenAuthorizeNetIFrame").click(function () {
$("#add_payment").show();
$("#send_token").attr({ "action": "https://test.authorize.net/payment/payment", "target": "add_payment" }).submit();

});

});

</script>
</head>
<body>

<div>
Open Authorize.net in an iframe to complete transaction
<button id="btnOpenAuthorizeNetIFrame" onclick="">Show Payment Form</button>
</div>
<div id="iframe_holder" class="center-block" style="width:90%;max-width: 1000px;height:90%max-height: 1000px">
<iframe id="add_payment" class="embed-responsive-item panel" name="add_payment" width="100%" height="1000" frameborder="0" scrolling="yes" hidden="false">
</iframe>
</div>
<form id="send_token" action="" method="post" target="add_payment" >
<input type="hidden" name="token" value="TOKEN VALUE" />

</form>

function parseQueryString(str) {
var vars = [];
var arr = str.split('&');
var pair;
for (var i = 0; i < arr.length; i++) {
pair = arr[i].split('=');
vars.push(pair[0]);
vars[pair[0]] = unescape(pair[1]);
}
return vars;
}
}());

</script>
</body>
</html>

Please help I need to generate token using javascript.

Re: implement getHostedpaymentPageRequest in Javascript

Renaissance — Tue, 14 Jun 2022 21:48:54 GMT

@furqanmajeed007 to get the token you don't use client side JS. You use node.js.

Re: implement getHostedpaymentPageRequest in Javascript

mkienenb — Thu, 23 Jun 2022 11:44:14 GMT

The problem with doing this client-side isn't a technical issue but a security issue. You'd be initiating requests from the client's ip address and running it on the client's browser and having to expose your credentials to do so. So it seems like a bad idea.

But there's probably nothing stopping you from doing this client-side.

You can find code examples here:

https://github.com/orgs/AuthorizeNet/repositories?type=all

topic implement getHostedpaymentPageRequest in Javascript in Integration and Testing

implement getHostedpaymentPageRequest in Javascript

Re: implement getHostedpaymentPageRequest in Javascript

Re: implement getHostedpaymentPageRequest in Javascript