asked 22 hours ago

I'm attempting to set up an iframe with externally hosted content following the instructions in the documentation: https://doc.laserfiche.com/laserfiche/en-us/content/pa-bp-build-form-scripts-lfform-custom-html.htm#2.BridgedatawithpostMessage

My page is currently hosted on GitHub Pages. It loads initial content properly and based on dev console logging I am confident that it is sending its initial handshake to the form. I started using the wildcard for parent origin partway through debugging, replacing it with the specific LF sandbox origin does not fix the issue.

 window.parent.postMessage({ type: 'employee-tabulator:ready' }, '*')

 

My form event listener waiting for the handshake detects and logs events fired by the form itself, but does not see the incoming ones from the iframe.

window.addEventListener("message", (event) => {
  console.log(event);
  if (
    event.origin !== allowedOrigin
  ) {
	console.log("received event from other origin");
    return;
  }
  
  console.log("Received from correct origin");

  tabulatorWindow = event.source;
  sendTableToTabulator();
});

 

Adding the logging below to the dev console after the form starts running confirms that the message my form listener is expecting to receive is being transmitted.

window.addEventListener("message", (event) => {
  if (event.origin === "<<my site>>") {
    console.log("Hosted iframe message reached app", event.data);
  }
});

 

Have I missed something along the way setting this up?

0 0