Cross-Origin-Embedder-Policy 设置后图片加载失败怎么办?

令狐维通 阅读 3

我在 Vue 项目里加了安全头 Cross-Origin-Embedder-Policy: require-corp,结果页面里的跨域图片全挂了,控制台报错说需要 CORS 或者 crossorigin 属性。但这些图片来自第三方 CDN,没法改响应头,有啥办法能绕过吗?

我试过给 img 标签加 crossorigin="anonymous",但没用,还是被拦截。代码大概是这样:

<template>
  <div>
    <img 
      src="https://example-cdn.com/avatar.jpg" 
      crossorigin="anonymous"
      alt="user avatar"
    />
  </div>
</template>
我来解答 赞 1 收藏
二维码
手机扫码查看
1 条解答
UP主~羽沫
既然搞不定第三方 CDN 的头,就把 require-corp 改成 Cross-Origin-Embedder-Policy: credentialless,这招对静态图片通常不需要 CORS 头。如果非得保留 require-corp,那只能自己写个 Nginx 或 Vite 代理转发图片,然后在响应里手动塞入 Access-Control-Allow-Origin: *
点赞
2026-03-04 14:57