86,886 reads

Resolving the Blocked a Frame with Origin "null" From Accessing a Cross-Origin Frame Error

by https://www.codingpanel.com/May 31st, 2022

Too Long; Didn't Read

Google Chrome has a security feature that blocks a frame with origin from accessing a cross-origin frame. This can happen when you try to show material from another website on your own. The same-origin policy prevents scripts from accessing content of sites with different origins. Using a local web server or using a browser with cross-domain web security/same-origin is a few solutions to the issue. The error occurs because of a request from a web service that is not permitted for security reasons, if you could do this then it would be a major security vulnerability.

Companies Mentioned

featured image - Resolving the Blocked a Frame with Origin "null" From Accessing a Cross-Origin Frame Error

The 'blocked a frame with origin "null" from accessing a cross-origin frame` error occurs because of `Cross-originn` request. To resolve this error, you have a number of solutions like using a `local web server` or using a browser with cross domain web security disabled few solutions to numbers.

This article will discuss all the solutions to solve cross-origin issues.

What Does the “Blocked a frame with origin "null" from accessing a cross-origin frame” Error Mean

Google Chrome has a security feature that blocks a frame with origin from accessing a cross-origin frame.

If you see an error that says “Blocked a frame with origin from accessing a cross-origin frame”, it means that this security feature is preventing the content from loading.

Why does “blocked a frame with the origin "null" from accessing a cross-origin frame “ happen

This can happen when you try to show material from another website on your own. This is referred to as a cross-origin request.

So accessing <frames> directly from your browser without using a web service is not permitted for security reasons, if you could do this then it would be a major security vulnerability.

The following is the error message you are getting:

DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame. error.

How to resolve “blocked a frame with origin "null" from accessing a cross-origin frame”

Solution 1:

Host your webpage on a local web server or use a different browser, such as Firefox.

Solution 2: cross-domain policy disabled

Run a browser with cross-domain web security/same-origin policy disabled.

Disabling the same-origin policy is extremely risky and should never be attempted unless you are confident of what you are doing.

Solution 3: Extensions like “xampp” or “Live Server”

You could solve it by installing xampp and moving all files to htdocs or using an extension like “Xampp”.

Solution 4: window.postMessage() method

Remember that the same-origin policy prevents scripts from accessing the content of sites with different origins, and you can securely enable cross-origin communication between Window objects by using window.postMessage().

`postMessage(message, targetOrigin)``postMessage(message, targetOrigin, [transfer])`

Browsers that follow the same-origin policy prevent scripts from accessing frames with different origins.html.

Conclusion:

Please keep in mind that turning off the same-origin policy (CORS) will only affect your browser. Also, disabling same-origin security settings in a browser allows any website to access cross-origin resources, which is extremely risky and should only be done for development purposes. Only window.postMessage() now is the best way to interact between frames/iframes.