corp用于控制跨源嵌入而非放行请求,同源加载不受其影响;其合法值same-site、same-origin、cross-origin分别限定嵌入范围,且与coep配合时必须显式设置才能避免资源加载失败。

CORP 头不是用来“放行跨域请求”的,而是告诉浏览器:“这个资源不许被其他源嵌入”,它和 CORS 是反向逻辑——一个拦,一个放。
为什么加了 CORP 还能被同域页面加载
CORP(Cross-Origin-Resource-Policy)只在**跨源嵌入场景**下起作用,比如:<img>、<script></script>、<link rel="stylesheet">、<iframe></iframe> 从其他源加载资源时。同源加载完全不受影响,也不检查 CORP 头。
- 同域页面
<img src="https://yoursite.com/logo.png?x-oss-process=image/resize,p_40">→ 不触发 CORP 检查 - 他域页面
<img src="https://yoursite.com/logo.png?x-oss-process=image/resize,p_40">→ 浏览器读取响应头中的Cross-Origin-Resource-Policy决定是否加载 - 如果没返回该头,或值非法(如
cross-origin但未配 COEP),浏览器默认允许加载(宽松 fallback)
CORP 的三个合法值及实际行为差异
必须是以下其一,大小写敏感,其他值等同于未设置:
-
Cross-Origin-Resource-Policy: same-site:只允许同站(same-site,协议+域名相同,端口可不同)嵌入。例如https://a.example.com可加载https://example.com/logo.png,但https://evil.com不行 -
Cross-Origin-Resource-Policy: same-origin:最严格。仅允许同源(协议+域名+端口完全一致)嵌入。连https://a.example.com加载https://example.com的资源都会被拒 -
Cross-Origin-Resource-Policy: cross-origin:显式允许任意跨源嵌入(等效于不设该头)。但注意:若页面同时启用了Cross-Origin-Embedder-Policy: require-corp(COEP),则此值仍会被接受;否则无实际约束力
和 COEP、COOP 一起用时的硬性依赖关系
如果你的页面设置了 Cross-Origin-Embedder-Policy: require-corp(常见于要用 SharedArrayBuffer 或 performance.measureMemory() 的场景),那么所有嵌入的跨域资源**必须**返回 Cross-Origin-Resource-Policy: cross-origin 或更宽松的策略,否则直接加载失败,Network 面板显示 net::ERR_BLOCKED_BY_RESPONSE。
- CDN 图片返回
Cross-Origin-Resource-Policy: same-site→ 页面开启 COEP 后,图片加载失败 - 字体文件(
<link rel="preload" as="font">)没配 CORP → 开启 COEP 后,字体加载被拦截,文字渲染为方块 - 解决方式不是去掉 COEP,而是让 CDN 或静态资源服务在响应中加上
Cross-Origin-Resource-Policy: cross-origin
CORP 和 CORS 响应头能否共存
可以,且常见于需要「既允许跨域加载,又防止被恶意站点滥用」的资源(如公开 API 的 JS SDK、CDN 上的通用工具库):
- 返回
Access-Control-Allow-Origin: *+Cross-Origin-Resource-Policy: cross-origin→ 允许任何源 fetch,也允许任何源<script></script>嵌入 - 返回
Access-Control-Allow-Origin: https://trusted.com+Cross-Origin-Resource-Policy: same-site→ fetch 只给 trusted.com,但嵌入只放行同站(二者策略独立生效) - 错误组合:
Access-Control-Allow-Origin: *+Cross-Origin-Resource-Policy: same-origin→ CORS 允许跨域读,CORP 却禁止跨域嵌入,逻辑矛盾但技术上不报错;只是<script></script>加载会失败,而fetch()成功
真正容易被忽略的是:CORP 是响应头,必须由资源所在服务器(不是你自己的前端服务器)发出;CDN、OSS、S3 等静态托管服务需单独配置,不能靠反向代理或前端代码补全。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











