referrerpolicy属性必须写在具体资源标签上，不是全局开关；对图片、脚本等资源加载完全无效，因其仅作用于导航行为，而资源请求在html解析早期同步发起，尚未生效；真正有效的是为每个、、、、等标签单独设置referrerpolicy属性，且值大小写敏感；rel="noreferrer"是唯一能彻底阻止referer发送的原生方案；全局兜底必须依赖后端referrer-policy响应头，优先级最高，覆盖所有请求类型。
referrerpolicy 属性必须写在具体资源标签上，不是全局开关
想靠 <meta name="referrer"> 控制图片、脚本或字体加载时的 Referer，根本没用——它只对页面解析完后用户点击链接、提交表单这类「导航行为」生效，而资源加载是解析 HTML 时同步发起的，<meta> 还没执行就被跳过了。
真正起效的方式是把 referrerpolicy 直接加在每个资源标签里：
-
<img src="https://cdn.com/photo.jpg?x-oss-process=image/resize,p_40" referrerpolicy="origin">：防图床因 Referer 不匹配返回403 -
<script src="https://cdn.com/analytics.js" referrerpolicy="strict-origin-when-cross-origin"></script>：同域保留路径调试，跨域只发https://yourdomain.com -
<link rel="stylesheet" href="https://fonts.googleapis.com/css2" referrerpolicy="no-referrer">：字体请求常被 origin 校验，清空最稳妥 -
<iframe src="https://embed.example.com/widget" referrerpolicy="origin-when-cross-origin"></iframe>：注意这是控制 iframe 自己向外发请求的 Referer，不是父页向它发的请求
值大小写敏感：no-referrer 有效，No-Referrer 或 no_referrer 会被浏览器静默忽略，退化为默认策略 no-referrer-when-downgrade。
rel="noreferrer" 是外链跳转唯一能彻底清 Referer 的方案
rel="noreferrer" 和 referrerpolicy="no-referrer" 完全不是一回事。前者是唯一能真正阻止 Referer 请求头发送的原生方式，且自动启用 noopener 防御 window.opener 劫持；后者只是裁剪 Referer，仍会发一个空值或 origin。
但它只对 <a></a> 和 <form></form> 的跳转生效，且有明确限制：
- 右键“在新标签页中打开”会绕过它，浏览器直接走自身默认策略
- 不能用于
<img>、<script></script>等资源标签 - 不能和
referrerpolicy混用，否则行为不可预测 - 写成
rel="nofollow"或rel="external"对 Referer 完全无效
响应头 Referrer-Policy 才是全局兜底的主力
所有前端 HTML 属性都是补位，真正覆盖全部请求类型（包括 fetch()、XMLHttpRequest、CSS/JS/字体加载、甚至 Service Worker）的，只有后端设置的 Referrer-Policy 响应头。
Nginx 示例配置：
add_header Referrer-Policy "strict-origin-when-cross-origin" always;
关键点：
-
always参数必须加：确保 4xx/5xx 错误页也生效，避免/admin?session=abc在报错时裸奔 - 响应头优先级最高，会覆盖
<meta name="referrer">和大部分元素级referrerpolicy（no-referrer除外） -
strict-origin-when-cross-origin是当前平衡隐私与功能的最佳选择：同域发完整 URL，跨域只发https://example.com，HTTPS→HTTP 降级时清空
CDN 资源 403 不是 referrerpolicy 没配好，而是服务端校验逻辑不匹配
即使你给 <img> 加了 referrerpolicy="origin"，CDN 仍返回 403，大概率是因为它的防盗链规则要求的是完整 Referer（含路径），而不是 origin。HTML 层面的控制只能决定「你发什么」，不能决定「别人怎么校验」。
解决方向分两层：
- 前端：确认 CDN 支持按 origin 白名单，若只认完整 URL，则
referrerpolicy="unsafe-url"生产环境禁用，改用origin+ 后端白名单 - 后端：Nginx 的
valid_referers必须显式包含none（允许直接访问）、blocked（允许被代理 stripped 的情况）、以及你的域名通配符 - 特别注意：单页应用（SPA）路由跳转不刷新 Referer，API 接口做 Referer 白名单极易误拦，慎用
最容易被忽略的是：用户首次从搜索引擎点击进来的那一次请求，<meta> 和元素属性都还没机会执行，Referer 行为完全由服务端响应头决定——这意味着，哪怕你页面里每个 <img> 都写了 referrerpolicy，首页第一次加载失败，问题就出在响应头配置上。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
