referrerpolicy属性必须显式写在标签上才生效，否则走默认策略no-referrer-when-downgrade；常用值包括no-referrer（不发referer）、origin（只发协议+域名+端口）、strict-origin-when-cross-origin（同源发完整url、跨源仅发origin、https→http不发），大小写敏感且需规避浏览器兼容性及服务端响应头覆盖等问题。
referrerpolicy 属性必须显式写在 <img> 标签上才对这张图的请求生效，不设就走浏览器默认策略（no-referrer-when-downgrade），而这个默认值在跨域时会发完整 URL，可能泄露 query 参数里的 token、user_id 等敏感信息。
哪些值能用，又分别发什么 Referer？
浏览器只认特定字符串，大小写敏感，拼错或加空格直接忽略：
-
no-referrer：请求头里彻底没有Referer:行 -
origin：只发协议+域名+端口，比如https://a.com，路径和查询参数全砍掉 -
strict-origin-when-cross-origin：同源请求发完整 URL；跨源只发origin；HTTPS → HTTP 时不发 —— 这是目前最平衡安全与兼容性的选择 -
no-referrer-when-downgrade：默认值，HTTPS → HTTP 不发，但 HTTPS → HTTPS 跨域仍发完整 URL，隐私风险高 -
unsafe-url：连 HTTP 页面也发完整 URL（含路径、查询参数），生产环境禁用
别用 same-origin 或 strict-origin，<img> 上它们会被浏览器静默降级，行为不可控。
为什么设了却没效果？常见失效原因
不是写了就一定管用，这几个硬约束常被忽略：
- 值必须是字符串字面量：
referrerpolicy="origin"✅，referrerpolicy={policy}（React 动态绑定）❌，除非确保挂载后 DOM 已更新且值合法 - 服务端响应头
Referrer-Policy会全局覆盖，除非你设的是no-referrer（它优先级最高） - 旧版 Safari（≤15.4）不支持该属性，得靠 CDN 或图床服务端配 Referer 白名单兜底
- 如果图片 403 且响应头带
X-Referer-Rejected，说明服务端校验失败，前端策略再对也没用，得对齐服务端接受的 origin 或关校验
怎么验证 referrerpolicy 真生效了？
不能只看页面是否显示图片，得查真实请求头：
- 打开 DevTools → Network → 找到对应图片请求 → 点开 → Headers → 查
Request Headers区域 - 设了
no-referrer却看到Referer:行 → 被响应头或<meta name="referrer">覆盖了 - 设了
origin却看到https://a.com/path?x=1→ 浏览器版本太低，或策略被忽略（比如用了无效值） - 图片加载成功但 Referer 是空或不符合预期 → 服务端可能做了重定向，第二跳请求不继承原
referrerpolicy，得在重定向目标页自己再设
真正关键的不是“有没有 Referer”，而是“它包含什么”——尤其当 URL 带临时 token 或用户标识时，少发一个字符都可能绕过防盗链或暴露身份。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
