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

Forum|Forum|5 years ago
October 23, 2020
2 replies
587 views

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.

This topic has been closed for replies.

C

ClayUUID

Legend

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

Z

zxc5ED8Author

Participant

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

C

ClayUUID

Legend

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.

Z

zxc5ED8Author

Participant

Any help would be appreciated! 🙂

Dre G

Participant

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.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded