Adobe animate canvas iframe, how to communicate from main document to canvas?

[zxc5ED8]

Hello.

I am creating content with adobe animate canvas.

I am embeding generated canvas output to my page as iframe.

How can I perform communication between adobe generated canvas output and actual my page document.

[zxc5ED8]

Any help would be appreciated! 🙂

[Dre G]

If your article HTML has this code:

function callMe(msg) {
    alert("callMe(" + msg + ")");
}

then, parent.callMe() should work. In other words, presuming the content block's instance name is "contentBlock1":

this.contentBlock1.on("click", function() {
    parent.callMe("Hello, world");
});

Without "this." in front of it, "parent" refers to "window.parent" which is the owner of the iframe.

[ClayUUID]

Although it's possible to directly access functions and properties in and out of iframes, this sort of thing is prone to being blocked by modern browsers as a cross-site scripting (XSS) security violation if they think the iframe and the parent are in different domains. The safe way to perform parent/iframe communication is to use postMessage().

https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

[zxc5ED8]

The iframe will be on the same domain. So there won't be cross origin problems? :?

[ClayUUID]

Also this is the only way to test parent/iframe communication from your local file system on modern browsers, since they consider everything from a local drive to be a different domain, even if it's the same drive and path.