iframe not displaying in edge

Question

I've embedded an iframe that displays fine in Chrome and Safari but not in Microsoft Edge. The code I'm using is:

<iframe allowfullscreen="" frameborder="0" height="1080" src="https://xd.adobe.com/embed/a2bd0a96-f6bc-4a5b-8ae4-e7b7e2ae5856-f7ee/" width="1920"></iframe>

In the developer tools console, Edge shows the following error:

DOMException: Failed to read the 'sessionStorage' property from 'Window": Access is denied for this document.

I have cookies enabled in Edge and have confirmed I am using the most current version of Edge. Any ideas for fixing this?

Answer 1

Don't use an iframe. iframes are a great way to inject malicious code into a site and every modern browser is purposefully starting to block iframe usefulness. For example, nothing would prevent a malicious user (or script) between you and a web server from injecting an iframe that has a source pointing to a completely different domain. This is the gist of why CORS is so important. If a malicious user injects content into your site then they would have the same access to the client as your app would which could expose sensitive data.

Most browsers have limited the ability to access anything on the parent page within an iframe. This helps sandbox the contents and prevent malicious actions but it is not foolproof. Hence why you're getting the failed to read error as the iframe does not have access to the parent window because it is not on the same domain. The workaround would be to configure CORS to allow that domain to access your site but you're opening yourself up for potential attack so be wary.

I should also mention that Edge's tracking prevention is also triggering on this so that isn't good either. But I don't think that is what is causing your issue.

Also be aware that both your site and the src you're linking to needs to use the same protocol. Mixing protocols will generate its own security errors.