Hi,
I am hosting an add payment form inside my page and I am using ICommunicator.html from the authorize.net samle application. I am able to host the form but communication between iframe and parent is not happening and it throwing an error about
"
Uncaught DOMException: Blocked a frame with origin "https://na.local.com" from accessing a cross-origin frame.
at callParentFunction (https://na.local.com/ssl/checkout/iCommunicator.html:8:29)
at https://na.local.com/ssl/checkout/iCommunicator.html:28:4".
For some reason its not allowing to use the js function.
this is how my ICommunicator.html looks like
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>IFrame Communicator</title>
<script type="text/javascript">
function callParentFunction(str) {
if (str && str.length > 0 && window.parent && window.parent.parent
&& window.parent.parent.CommunicationHandler && window.parent.parent.CommunicationHandler.onReceiveCommunication)
{
var referrer = document.referrer;
window.parent.parent.CommunicationHandler.onReceiveCommunication({qstr : str , parent : referrer});
}
}
function receiveMessage(event) {
if (event && event.data) {
callParentFunction(event.data);
}
}
if (window.addEventListener) {
window.addEventListener("message", receiveMessage, false);
} else if (window.attachEvent) {
window.attachEvent("onmessage", receiveMessage);
}
if (window.location.hash && window.location.hash.length > 1) {
callParentFunction(window.location.hash.substring(1));
}
</script>
</head>
<body>
</body>
</html>
and I have added javascript in my code but its not hitting that because of that error.
///<summary> authorize.net js</summary>
window.CommunicationHandler = {};
function parseQueryString(str) {
var vars = [];
var arr = str.split('&');
var pair;
for (var i = 0; i < arr.length; i++) {
pair = arr[i].split('=');
vars[pair[0]] = unescape(pair[1]);
}
return vars;
}
window.CommunicationHandler.onReceiveCommunication = function (argument) {
var params = parseQueryString(argument.qstr);
switch (params['action']) {
case "resizeWindow":
console.log('resize'); break;
case "successfulSave":
console.log('save'); break;
case "cancel":
console.log('cancel'); break;
case "transactResponse":
sessionStorage.removeItem("HPTokenTime");
console.log('transaction complete');
var transResponse = JSON.parse(params['response']);
window.location.href = 'ssl/checkout/ReviewAndPay.aspx';
}
}
Thanks,
Julin
