Cybersource Developer Community Cybersource Developer Community

marine2026 · ‎08-22-2023

In the IFrame Communicator javascript code posted by Authorize Net, at the time when receiveMessage(event) function is called with the result of the submitting the payment information the window.parent.parent.CommunicationHandler is not defined.

On the previous call to the receiveMessage(event) function, when tabbing through the payment form and scrolling the embedded iframe, the window.parent.parent.CommunicationHandler is defined.

So the context of the last call to receiveMessage has lost the reference to window.parent.parent.CommunicationHandler

Please let me know when this has been fixed. My project is waiting on this.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title>IFrame Communicator</title>

 <!--
  To securely communicate between our Accept Hosted form and your web page,
  we need a communicator page which will be hosted on your site alongside
  your checkout/payment page. You can provide the URL of the communicator
  page in your token request, which will allow Authorize.Net to embed the
  communicator page in the payment form, and send JavaScript messaging through
  your communicator page to a listener script on your main page.

  This page contains a JavaScript that listens for events from the payment
  form and passes them to an event listener in the main page.
-->


 <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>

marine2026 · ‎08-22-2023

The problem with the above IFrame Communicator is that it was taken form the GitHub application, and it wrongly references .

CommunicationHandler

...and it should instead be referencing .AuthorizeNetIFrame

Secondly, the container javascript references an object wrongly. The function call below receives an object. str should reference the property qstr, str.qstr.split('&'); and not .split on the str object.

Thirdly, the javascript library loaded should be functional for all users and should have the source reference:

<script
src="https://code.jquery.com/jquery-3.7.0.min.js"
integrity="sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g="
crossorigin="anonymous"></script>

function parseQueryString(str) {
					var vars = [];
					var arr = str.qstr.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;
					}

View solution in original post

marine2026 · ‎08-22-2023

The problem with the above IFrame Communicator is that it was taken form the GitHub application, and it wrongly references .

CommunicationHandler

...and it should instead be referencing .AuthorizeNetIFrame

Secondly, the container javascript references an object wrongly. The function call below receives an object. str should reference the property qstr, str.qstr.split('&'); and not .split on the str object.

Thirdly, the javascript library loaded should be functional for all users and should have the source reference:

<script
src="https://code.jquery.com/jquery-3.7.0.min.js"
integrity="sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g="
crossorigin="anonymous"></script>

function parseQueryString(str) {
					var vars = [];
					var arr = str.qstr.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;
					}

Cybersource Developer Community Cybersource Developer Community

AUTHORIZE NET ADMINISTRATOR ----- THIS IS A BUG REPORT --- IFRAME COMMUNICATOR JAVASCRIPT IS BROKEN