cancel
Showing results for 
Search instead for 
Did you mean: 

Getting 'Accept is undefined' JavaScript runtime error when testing with accept.js

Hi,

    I am testing credit card payments on my NopCommerce based web store using Test mode in Authorize.net with Accept.js.

 

I am getting the javascript run-time error, 'Accept is undefined' when I try to call 

 

Accept.dispatchData.

 

Intellisense picks up the Accept object.

 

My script is as follows:

 

 

 

var PaymentInfo = {
form: false,
saveUrl: false,

init: function (form, saveUrl) {
this.form = form;
this.saveUrl = saveUrl;
},

save: function () {
if (Checkout.loadWaiting != false) return;


this.sendPaymentDataToAnet();
Checkout.setLoadWaiting('payment-info');
$.ajax({
cache: false,
url: this.saveUrl,
data: $(this.form).serialize(),
type: 'post',
success: this.nextStep,
complete: this.resetLoadWaiting,
error: Checkout.ajaxFailure
});
},
sendPaymentDataToAnet: function () {
var secureData = {}; authData = {}; cardData = {};

//document.writeln("<script type='text/javascript' src='https://js.authorize.net/v1/Accept.js' charset='utf-8'></script>");

var imported = document.createElement("script");
imported.src="https://jstest.authorize.net/v1/Accept.js";
imported.charset = "utf-8";

document.head.appendChild(imported);
// for Sandbox / Testing use 
// for Production use, use https://js.authorize.net/v1/Accept.js
//$.getScript('https://jstest.authorize.net/v1/Accept.js', function () {
try {
// Extract the card number, expiration date, and card code.
cardData.cardNumber = document.getElementById("CardNumber").value;
cardData.month = document.getElementById("ExpireMonth").value;
cardData.year = document.getElementById("ExpireYear").value;
cardData.cardCode = document.getElementById("CardCode").value;
secureData.cardData = cardData;

// The Authorize.Net Client Key is used in place of the traditional Transaction Key. The Transaction Key
// is a shared secret and must never be exposed. The Client Key is a public key suitable for use where
// someone outside the merchant might see it.
authData.clientKey = "****" ;

authData.apiLoginID = "****";
secureData.authData = authData;

// Pass the card number and expiration date to Accept.js for submission to Authorize.Net.

Accept.dispatchData(secureData, 'responseHandler');
} catch (ex) {
console.log(ex.message);
}

//});
},
responseHandler: function (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);
}
alert("acceptJS library error!")
} else {
console.log(response.opaqueData.dataDescriptor);
console.log(response.opaqueData.dataValue);
//this.processTransaction(response.opaqueData);

var frmPaymentInfo= document.getElementById("co-payment-info-form");
var amount = document.createElement("input")
amount.hidden = true;
amount.value = document.getElementById('amount').value;
amount.name = "amount";
amount.id = "amount";
frmPaymentInfo.appendChild(amount);

var dataDesc = document.createElement("input")
dataDesc.hidden = true;
dataDesc.value = response.opaqueData.dataDescriptor;
dataDesc.name = "dataDesc";
dataDesc.id = "dataDesc";
frmPaymentInfo.appendChild(dataDesc);

var dataValue = document.createElement("input")
dataValue.hidden = true;
dataValue.value = response.opaqueData.dataValue;
dataValue.name = "dataValue";
dataValue.id = "dataValue";
frmPaymentInfo.appendChild(dataValue);

}
},

 

Please help.

 

 

 

Saad

saadm
Member
3 REPLIES 3

In this case, Accept.js functions are not loaded when the call to Accept.dispatchData() is made.
One way is to remove the loading from the sendPaymentDataToAnet() function and do something like : 

<body onload="loadScript()"> 

function loadScript() {
var imported = document.createElement("script");
imported.src="https://jstest.authorize.net/v1/Accept.js";
imported.charset = "utf-8";
document.head.appendChild(imported);
}

 

Powered by NexWebSites.com -
Certified Authorize.net developers
NexusSoftware
Trusted Contributor

It did not work with body onload either.  I finally got it to work by copying and pasting the Accept.js script directly into the sendPaymentDataToAnet function like this:

 

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

var Accept = function () { "use strict"; function a(a) { var b; ((b = g.hash(a.responseText)) && b ? b = "187361d772b193b659e74089acebc3a2077f044c89345d96b2149775796a3bc3" !== b : 0) && (console.warn("Library is not coming from Accept server--- " + g.hash(a.responseText)), setTimeout(f, 2e3)), a = void 0 } function b(a, b) { var c = null; c = "undefined" != typeof XDomainRequest ? new XDomainRequest : new XMLHttpRequest, c.open("get", a, !0), c.send(), c.onload = function () { setTimeout(function () { b(c), 2e3 }) } } function c(a) { var b = document.createElement("script"); b.type = "text/javascript", b.src=a, (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(b) } function d(a, b) { console.warn("Accept.js is not loaded correctly"); var c = { messages: { resultCode: "Ok", message: [] } }; c.messages.resultCode = "Error", c.messages.message.push({ code: "E_WC_03", text: "Accept.js is not loaded correctly" }), "function" == typeof b ? b.call(null, c) : window[b](c) } function e() { var a = document.getElementsByTagName("body")[0]; a.addEventListener("handshake", function () { window.isReady = !0 }, !1) } window.cdnPath = "https://js.authorize.net", window.cdnPath = window.cdnPath + "/v1/", window.encryptEndPoint = "https://api.authorize.net"; var f = function () { Accept.dispatchData = function (a, b) { var c = { messages: { resultCode: "Ok", message: [] } }; c.messages.resultCode = "Error", c.messages.message.push({ code: "E_WC_03", text: "Accept.js is not loaded correctly" }), "function" == typeof b ? b.call(null, c) : window[b](c) } }, g = {}; return g.hash = function (a) { a = a.utf8Encode(); var b = [1116352408, 1899447441, 3049323471, 3921009573, 961987163, 1508970993, 2453635748, 2870763221, 3624381080, 310598401, 607225278, 1426881987, 1925078388, 2162078206, 2614888103, 3248222580, 3835390401, 4022224774, 264347078, 604807628, 770255983, 1249150122, 1555081692, 1996064986, 2554220882, 2821834349, 2952996808, 3210313671, 3336571891, 3584528711, 113926993, 338241895, 666307205, 773529912, 1294757372, 1396182291, 1695183700, 1986661051, 2177026350, 2456956037, 2730485921, 2820302411, 3259730800, 3345764771, 3516065817, 3600352804, 4094571909, 275423344, 430227734, 506948616, 659060556, 883997877, 958139571, 1322822218, 1537002063, 1747873779, 1955562222, 2024104815, 2227730452, 2361852424, 2428436474, 2756734187, 3204031479, 3329325298], c = [1779033703, 3144134277, 1013904242, 2773480762, 1359893119, 2600822924, 528734635, 1541459225]; a += String.fromCharCode(128); for (var d = a.length / 4 + 2, e = Math.ceil(d / 16), f = new Array(e), h = 0; h < e; h++) { f[h] = new Array(16); for (var i = 0; i < 16; i++)f[h][i] = a.charCodeAt(64 * h + 4 * i) << 24 | a.charCodeAt(64 * h + 4 * i + 1) << 16 | a.charCodeAt(64 * h + 4 * i + 2) << 8 | a.charCodeAt(64 * h + 4 * i + 3) } f[e - 1][14] = 8 * (a.length - 1) / Math.pow(2, 32), f[e - 1][14] = Math.floor(f[e - 1][14]), f[e - 1][15] = 8 * (a.length - 1) & 4294967295; var j, k, l, m, n, o, p, q, r = new Array(64); for (h = 0; h < e; h++) { for (var s = 0; s < 16; s++)r[s] = f[h][s]; for (s = 16; s < 64; s++)r[s] = g.s1(r[s - 2]) + r[s - 7] + g.s0(r[s - 15]) + r[s - 16] & 4294967295; for (j = c[0], k = c[1], l = c[2], m = c[3], n = c[4], o = c[5], p = c[6], q = c[7], s = 0; s < 64; s++) { var t = q + g.S1(n) + g.Ch(n, o, p) + b[s] + r[s], u = g.S0(j) + g.Maj(j, k, l); q = p, p = o, o = n, n = m + t & 4294967295, m = l, l = k, k = j, j = t + u & 4294967295 } c[0] = c[0] + j & 4294967295, c[1] = c[1] + k & 4294967295, c[2] = c[2] + l & 4294967295, c[3] = c[3] + m & 4294967295, c[4] = c[4] + n & 4294967295, c[5] = c[5] + o & 4294967295, c[6] = c[6] + p & 4294967295, c[7] = c[7] + q & 4294967295 } return g.toHexStr(c[0]) + g.toHexStr(c[1]) + g.toHexStr(c[2]) + g.toHexStr(c[3]) + g.toHexStr(c[4]) + g.toHexStr(c[5]) + g.toHexStr(c[6]) + g.toHexStr(c[7]) }, g.ROTR = function (a, b) { return b >>> a | b << 32 - a }, g.S0 = function (a) { return g.ROTR(2, a) ^ g.ROTR(13, a) ^ g.ROTR(22, a) }, g.S1 = function (a) { return g.ROTR(6, a) ^ g.ROTR(11, a) ^ g.ROTR(25, a) }, g.s0 = function (a) { return g.ROTR(7, a) ^ g.ROTR(18, a) ^ a >>> 3 }, g.s1 = function (a) { return g.ROTR(17, a) ^ g.ROTR(19, a) ^ a >>> 10 }, g.Ch = function (a, b, c) { return a & b ^ ~a & c }, g.Maj = function (a, b, c) { return a & b ^ a & c ^ b & c }, g.toHexStr = function (a) { for (var b, c = "", d = 7; d >= 0; d--)b = a >>> 4 * d & 15, c += b.toString(16); return c }, "complete" === document.readyState ? e() : window.addEventListener ? window.addEventListener("load", e, !1) : window.attachEvent ? window.attachEvent("onload", e) : window.onLoad && (window.onload = e), "undefined" == typeof String.prototype.utf8Encode && (String.prototype.utf8Encode = function () { return unescape(encodeURIComponent(this)) }), "undefined" == typeof String.prototype.utf8Decode && (String.prototype.utf8Decode = function () { try { return decodeURIComponent(escape(this)) } catch (a) { return this } }), c(cdnPath + "AcceptCore.js"), b(cdnPath + "AcceptCore.js", a), { dispatchData: d } }();
//document.writeln("<script type='text/javascript' src='https://js.authorize.net/v1/Accept.js' charset='utf-8'></script>");

//var imported = document.createElement("script");
//imported.src="https://jstest.authorize.net/v1/Accept.js";
//imported.charset = "utf-8";

//document.head.appendChild(imported);
// for Sandbox / Testing use
// for Production use, use https://js.authorize.net/v1/Accept.js
//$.getScript('https://jstest.authorize.net/v1/Accept.js', function () {
try {
// Extract the card number, expiration date, and card code.
cardData.cardNumber = document.getElementById("CardNumber").value;
cardData.month = document.getElementById("ExpireMonth").value;
cardData.year = document.getElementById("ExpireYear").value;
cardData.cardCode = document.getElementById("CardCode").value;

secureData.cardData = cardData;

// The Authorize.Net Client Key is used in place of the traditional Transaction Key. The Transaction Key
// is a shared secret and must never be exposed. The Client Key is a public key suitable for use where
// someone outside the merchant might see it.
authData.clientKey = "54uHXf4tGxS3ghn448PSn7wHWJ2RZDxAe2qc68fJdxx43Q438khaHV9TRdyzBTAq";
authData.apiLoginID = "concordea2014";
secureData.authData = authData;

// Pass the card number and expiration date to Accept.js for submission to Authorize.Net.

Accept.dispatchData(secureData, this.responseHandler);
} catch (ex) {
console.log(ex.message);
}

//});
},

 

but now I am getting an 'acceptJS library error' in responseHandler callback function.

 

 

 

Saad

It is working being called from the body onload: https://nexwebsites.com/authorize.net-token-tester/test-accept.html

 

Why not just put :

<script type="text/javascript" src="https://jstest.authorize.net/v1/Accept.js" charset="utf-8"></script>

in your header or do a conditional file inclusion from the code behind, if you must?

Powered by NexWebSites.com -
Certified Authorize.net developers
NexusSoftware
Trusted Contributor