How to add Cross-Origin-Resource-Policy on Next.js
Last updated · Reviewed by a CISSP-certified security practitioner
To add Cross-Origin-Resource-Policy on Next.js, set the header in next.config.js with the value same-origin. Stops other sites from loading your resources. Restart dev server or redeploy. Then confirm it with curl -I or a free FixSecurityHeaders scan.
What does Cross-Origin-Resource-Policy do?
CORP tells browsers which origins may embed your images, scripts and other resources.
Risk if missing: Other sites can embed your resources and use side channels to leak data.
What is the Next.js configuration?
Add this to next.config.js:
// next.config.js
module.exports = {
poweredByHeader: false,
async headers() {
return [
{
source: "/(.*)",
headers: [
{ key: "Cross-Origin-Resource-Policy", value: "same-origin" },
],
},
];
},
};How do I add it step by step?
- Open next.config.js.
- Paste the Cross-Origin-Resource-Policy configuration shown below.
- Restart dev server or redeploy.
- Run curl -I https://yourdomain.com and look for the cross-origin-resource-policy line.
- Scan your site on FixSecurityHeaders to confirm the grade improved.
How do I verify it worked?
curl -sI https://yourdomain.com | grep -i "cross-origin-resource-policy"
# expected:
# cross-origin-resource-policy: same-originCheck your site now
Free scan, instant grade, exact fixes for your stack.
What are the common mistakes?
- Public CDNs and assets meant for embedding should use cross-origin.
- For nonce-based CSP use middleware.ts instead of static headers.
- poweredByHeader: false removes X-Powered-By.
Quick reference
| Header | Cross-Origin-Resource-Policy |
|---|---|
| Recommended value | same-origin |
| Stack | Next.js |
| Where | next.config.js |
| Compliance | OWASP ASVS V14.4 |
FAQ
What value should I use for Cross-Origin-Resource-Policy?
A safe default is same-origin. Public CDNs and assets meant for embedding should use cross-origin.
Why isn't Cross-Origin-Resource-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-Resource-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-Resource-Policy?
OWASP ASVS V14.4.
Related guides
- Cross-Origin-Resource-Policy explained
- Cross-Origin-Resource-Policy on Nginx
- Cross-Origin-Resource-Policy on Apache
- Cross-Origin-Resource-Policy on IIS
- Cross-Origin-Resource-Policy on Cloudflare
- Strict-Transport-Security on Next.js
- Content-Security-Policy on Next.js
- X-Content-Type-Options on Next.js
- X-Frame-Options on Next.js