ERR_BLOCKED_BY_RESPONSE: Which Header Blocked It, and How to Fix

Four different mechanisms surface as the same network error. The DevTools console message tells them apart — read it before changing any header.

Two of these you cannot fix from your own site: X-Frame-Options and frame-ancestors are set by the site you are trying to embed, and they are a deliberate refusal. There is no client-side flag that overrides them. Check what a target actually sends with the HTTP header checker before assuming it is your configuration.

• Page with Cross-Origin-Embedder-Policy: require-corp embeds a resource without CORP
• COOP: same-origin + popup.open() to another origin
• X-Frame-Options: DENY on iframe embed
• CORP: same-site accessed from another eTLD+1
• Broken CORS preflight with 200 but no Access-Control-Allow-Origin

1. On the embedded resource: Cross-Origin-Resource-Policy: cross-origin
2. If you own both sides: CORP: same-site
3. For iframes: Cross-Origin-Opener-Policy: unsafe-none (relaxes)
4. Check Enterno HTTP Checker — see all response headers
5. For SharedArrayBuffer: COOP + COEP both on same-origin + require-corp

Check your site's security →

• ERR_HTTP_RESPONSE_CODE_FAILURE — non-2xx reached a caller that reads the status
• ERR_EMPTY_RESPONSE — connection closed with no data
• ERR_TOO_MANY_REDIRECTS — redirect loop

The ERR_BLOCKED_BY_RESPONSE error occurs when a browser blocks a request due to Cross-Origin Embedder Policy (COEP) or Cross-Origin Resource Policy (CORP) settings. To resolve this, ensure your server responds with the correct headers: Cross-Origin-Embedder-Policy: require-corp and Cross-Origin-Resource-Policy: same-origin. Additionally, check for any CORS misconfigurations that may be causing the block.

The ERR_BLOCKED_BY_RESPONSE error is a security feature in modern browsers designed to protect users from potentially malicious content. This error indicates that a resource was blocked due to the absence of appropriate Cross-Origin policies. COEP and CORP are security headers that help control how resources are shared across different origins. Specifically, COEP requires that any cross-origin resources are explicitly marked as safe via CORP, otherwise, they will be blocked.

When a web application requests resources (like scripts, images, or iframes) from a different origin, the browser checks the response headers to determine if the request should be allowed. If the required headers are not present or are incorrectly configured, the browser will block the request, leading to the ERR_BLOCKED_BY_RESPONSE error.

To better understand this issue, let's look at the two key headers:

• Cross-Origin-Embedder-Policy (COEP): This header tells the browser that the document requires all of its cross-origin resources to be explicitly marked as safe. The possible values are unsafe-none, require-corp, and require-embedder.
• Cross-Origin-Resource-Policy (CORP): This header controls how resources can be shared across origins. It can take values like same-origin, same-site, and cross-origin.

Both headers are crucial for maintaining a secure browsing experience and preventing clickjacking, data theft, and other security vulnerabilities.

To fix the ERR_BLOCKED_BY_RESPONSE error, you need to ensure that your server is configured to send the appropriate headers. Here’s a step-by-step guide to resolving this error:

1. Check Server Configuration: Depending on your server type (Apache, Nginx, etc.), you need to modify the configuration files to include the necessary headers.

Example for Apache

Header set Cross-Origin-Embedder-Policy "require-corp"
Header set Cross-Origin-Resource-Policy "same-origin"

1. Check Resource Responses: Verify that all resources your application loads (images, scripts, etc.) respond with the correct CORP headers. You can use browser developer tools to inspect the network requests and their respective headers.
2. Update Client-Side Code: Ensure that your client-side code properly handles cross-origin requests. If certain resources are being blocked, consider changing their origin or ensuring they are served with the correct headers.
3. Test Changes: After making the necessary changes, test your application in multiple browsers to ensure that the error is resolved. Use tools like curl to verify the headers directly from the command line:

curl -I https://yourdomain.com/resource

If the headers are correctly set, you should see:

HTTP/1.1 200 OK
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Resource-Policy: same-origin

By following these steps, you should be able to effectively resolve the ERR_BLOCKED_BY_RESPONSE error and ensure your web application operates smoothly across different browsers.