How to add Cross-Origin-Embedder-Policy on Next.js

Last updated November 11, 2026 · Reviewed by a CISSP-certified security practitioner

To add Cross-Origin-Embedder-Policy on Next.js, set the header in next.config.js with the value require-corp. Requires embedded resources to opt in (enables cross-origin isolation). Restart dev server or redeploy. Then confirm it with curl -I or a free FixSecurityHeaders scan.

What does Cross-Origin-Embedder-Policy do?

COEP makes the page refuse cross-origin resources that haven't opted in via CORP or CORS. Combined with COOP it enables cross-origin isolation.

Risk if missing: Informational: mainly needed for SharedArrayBuffer and high-precision timers.

What is the Next.js configuration?

Add this to next.config.js:

next.config.js

// next.config.js
module.exports = {
  poweredByHeader: false,
  async headers() {
    return [
      {
        source: "/(.*)",
        headers: [
          { key: "Cross-Origin-Embedder-Policy", value: "require-corp" },
        ],
      },
    ];
  },
};

How do I add it step by step?

Open next.config.js.
Paste the Cross-Origin-Embedder-Policy configuration shown below.
Restart dev server or redeploy.
Run curl -I https://yourdomain.com and look for the cross-origin-embedder-policy line.
Scan your site on FixSecurityHeaders to confirm the grade improved.

How do I verify it worked?

terminal

curl -sI https://yourdomain.com | grep -i "cross-origin-embedder-policy"
# expected:
# cross-origin-embedder-policy: require-corp

Check your site now

Free scan, instant grade, exact fixes for your stack.

What are the common mistakes?

Easily breaks third‑party images, fonts and embeds. Consider credentialless, and only deploy if you need isolation.
For nonce-based CSP use middleware.ts instead of static headers.
poweredByHeader: false removes X-Powered-By.

Quick reference

Header	`Cross-Origin-Embedder-Policy`
Recommended value	`require-corp`
Stack	Next.js
Where	next.config.js
Compliance	OWASP ASVS V14.4

FAQ

What value should I use for Cross-Origin-Embedder-Policy?

A safe default is require-corp. Easily breaks third‑party images, fonts and embeds. Consider credentialless, and only deploy if you need isolation.

Why isn't Cross-Origin-Embedder-Policy showing up on Next.js?

For nonce-based CSP use middleware.ts instead of static headers. Also clear any CDN or page cache, and check you edited the config that actually serves your domain.

Does Cross-Origin-Embedder-Policy affect SEO or performance?

No measurable performance cost — it's a few bytes per response. It doesn't affect rankings directly, but a misconfigured policy can break page resources, so test before enforcing.

Which compliance frameworks reference Cross-Origin-Embedder-Policy?

OWASP ASVS V14.4.