How to Configure Cross-Origin Embedder Policy (COEP) Credentialless Mode in Google Chrome

Achieving cross-origin isolated status in web applications is essential for unlocking high-performance capabilities such as SharedArrayBuffer, precise performance timers, and WebGPU compute pipelines. However, traditional Cross-Origin Embedder Policy (COEP) with require-corp enforces an onerous requirement: every embedded cross-origin image, script, stylesheet, or font must explicitly return a Cross-Origin-Resource-Policy (CORP) header. When integrating third-party dependencies, uncooperative external CDNs often block migration. Google Chrome resolves this impasse via credentialless mode, enabling cross-origin isolation while seamlessly loading legacy subresources without credentials.

Understanding COEP credentialless vs require-corp

The credentialless directive modifies how Google Chrome fetches cross-origin subresources:

• Cross-Origin-Embedder-Policy: credentialless: Requests to cross-origin subresources are dispatched without ambient credentials—omitting HTTP cookies, client certificates, and HTTP Basic authentication. Because no credentials accompany the request, the response is immune to cross-site search (XS-Search) and side-channel data leakage.
• No Remote CORP Required: Because the request is stripped of user identity, Chrome allows the asset to load even if the remote CDN server completely omits the Cross-Origin-Resource-Policy header.
• Same-Origin Isolation Preserved: The top-level document achieves full crossOriginIsolated === true status when paired with Cross-Origin-Opener-Policy: same-origin.

Configuring Web Server Headers for Credentialless Isolation

Configure your production reverse proxy or web server to deliver the credentialless policy header pair:

# Nginx server block configuration
add_header Cross-Origin-Opener-Policy "same-origin" always;
add_header Cross-Origin-Embedder-Policy "credentialless" always;

# Apache HTTP Server (.htaccess / virtual host)
Header always set Cross-Origin-Opener-Policy "same-origin"
Header always set Cross-Origin-Embedder-Policy "credentialless"

Auditing Credentialless Subresource Requests in Chrome DevTools

To inspect and verify credentialless network requests in Google Chrome:

1. Open Google Chrome and navigate to your web application.
2. Open Chrome DevTools by pressing Ctrl + Shift + I (or Option + Command + I on macOS).
3. Switch to the Console tab and verify the isolation state:

   crossOriginIsolated

   Chrome returns true.

4. Select the Network tab and click on an external third-party image or font request.
5. Inspect the Request Headers. Verify that the Cookie header is completely stripped from the outgoing request payload.
6. Check the Issues tab in DevTools to confirm that no COEP blocking warnings are raised for third-party media assets.

Managing Authenticated Subresource Exceptions

If your application legitimately requires credentials when fetching specific cross-origin API endpoints, use standard CORS mode (fetch(url, { credentials: 'include', mode: 'cors' })). In CORS mode, Chrome includes credentials provided the destination server explicitly returns Access-Control-Allow-Credentials: true and matching origin headers.