What Is ERR_BLOCKED_BY_RESPONSE and How Do You Fix It?

ERR_BLOCKED_BY_RESPONSE is an error showing that the browser blocked a page or resource because the response headers sent by the server do not allow it. It most often appears when a site is embedded in another site with an iframe: the frame shows “… refused to connect” and the console shows net::ERR_BLOCKED_BY_RESPONSE. In this guide we explain the causes and the fixes for site owners and developers.

What Does ERR_BLOCKED_BY_RESPONSE Mean?

This error is not a connection problem: the request reached the server and a response came back. But a security header in the response forbids the content from being shown in this context (for example inside another site’s frame), and the browser follows that rule. In other words, the browser is enforcing the site’s own security rule. In the console the error sometimes appears with an extra explanation, such as ERR_BLOCKED_BY_RESPONSE.NotSameOrigin.

Causes of the Error

• X-Frame-Options: If a page sends X-Frame-Options: DENY or SAMEORIGIN, it will not open inside other sites’ frames.
• CSP frame-ancestors: The frame-ancestors directive in the Content-Security-Policy header sets which sites may frame the page.
• Cross-Origin-Resource-Policy (CORP): If an image, script or file is served with a same-origin or same-site policy, it cannot be loaded from other sites.
• Cross-Origin-Embedder-Policy (COEP): If your page uses a require-corp policy, external resources that do not send a permission header are blocked.
• Security plugin or CDN rule: WordPress security plugins and CDN settings can add these headers automatically.

What You Can Do as a Visitor

Because the rule is set by the site itself, there is no permanent fix on the visitor’s side. If you want to see the content inside the frame, open the link directly in a new tab; the page loads normally. Browser extensions that strip these headers are not recommended, because the headers protect you against attacks such as clickjacking.

How to Fix It as a Site Owner or Developer

1. Find Which Header Is Blocking

In the Network tab of the developer tools, click the blocked request and look at the Response Headers. You can also check from the command line:

curl -sI https://yourdomain.com/page | grep -iE "x-frame-options|content-security-policy|cross-origin"

2. Allow Framing Only for Sites You Trust

If you want your own page to open inside a frame on a specific site, use CSP instead of X-Frame-Options and list the allowed sites explicitly. An example for Nginx:

add_header Content-Security-Policy "frame-ancestors 'self' https://allowed-site.com" always;

If the same response also sends X-Frame-Options: DENY, remove it. Allowing every site to frame the page (frame-ancestors *) increases the clickjacking risk; add only the sites that really need it.

3. Fix the CORP Setting for Shared Resources

If your images or files need to be used on other sites, serve them with the Cross-Origin-Resource-Policy: cross-origin header. If your page uses COEP, the external resources you load must send this header or be loaded with CORS.

4. If You Cannot Frame Another Site’s Page

If the header comes from another site’s server, you cannot change it. In that case, use the site’s official embed link or API, or link to the content instead.

If the console shows a generic CORS-related error, see our guide on ERR_FAILED.

Conclusion

ERR_BLOCKED_BY_RESPONSE shows that the browser blocked a page or resource by following the site’s own security headers. As a visitor, opening the page in a new tab is enough. If you own the site, set the X-Frame-Options, CSP frame-ancestors and Cross-Origin-Resource-Policy headers to match your needs, allowing only sites you trust.