How to add the Cross-Origin-Opener-Policy header in Next.js

Next.js configuration (next.config)

async headers() {
  return [
    {
      source: "/:path*",
      headers: [{ key: "Cross-Origin-Opener-Policy", value: "same-origin" }],
    },
  ];
}

Add the headers() function to your Next.js config and restart or redeploy. Headers set by a proxy or CDN in front can override these.

Before you deploy

same-origin can break OAuth or payment pop-ups that rely on window.opener. Use same-origin-allow-popups in that case.

Verify it works

curl -sI https://your-site.com | grep -i cross-origin-opener-policy

Or run a free Korrali Web scan to check this and every other security header at once.

Other headers in Next.js

• Strict-Transport-Security in Next.js
• Content-Security-Policy in Next.js
• X-Frame-Options in Next.js
• X-Content-Type-Options in Next.js
• Referrer-Policy in Next.js
• Permissions-Policy in Next.js
• Cross-Origin-Resource-Policy in Next.js