rel="noreferrer"是唯一能彻底阻止referer请求头发送的html原生方案,非隐藏而是根本不发,且自动启用noopener防御劫持,全浏览器兼容、不依赖js;它仅作用于和标签点击跳转,对右键新开、提交或js跳转无效,不可与referrerpolicy混用。

rel="noreferrer" 是链接跳转时最安全的 Referrer 控制方式
它不是“隐藏”,而是彻底阻止 Referer 请求头发送,且自动启用 noopener 防御 window.opener 劫持。所有现代浏览器(Chrome 51+、Firefox 50+、Safari 11.1+、Edge 79+)都支持,静态页、SEO、JS 禁用场景下均生效。
常见错误包括:
- 写成
rel="nofollow"或rel="external"—— 这两个值对 Referer 完全无影响 - 误以为
rel="noreferrer"可用于<form></form>—— 它只对<a></a>和<area>生效 - 右键“在新标签页中打开”会绕过该属性 —— 浏览器直接忽略,走自身默认策略
referrerpolicy 属性不能替代 rel="noreferrer",仅补位特定资源请求
referrerpolicy 只作用于主动发起网络请求的 HTML 元素,比如 <img>、<script></script>、<iframe></iframe>、<link>、<form></form>,但不支持 <div> 或纯文本容器。
<p>关键限制:</p>
<ul>
<li>
<code><a href="..." referrerpolicy="no-referrer"></a> 虽然语法合法,但效果弱于 rel="noreferrer":它只控制 Referer,不带 noopener
<form></form> 必须显式加 referrerpolicy 才生效,不会继承页面级策略unsafe-url 会泄露完整 URL(含 ?token=xxx),生产环境禁止使用HTTP 响应头 Referrer-Policy 是全局兜底的唯一可靠方案
Referrer-Policy 响应头由后端设置(如 Nginx 的 add_header Referrer-Policy "strict-origin-when-cross-origin" always;),覆盖所有本域发起的请求:JS 的 fetch()、XMLHttpRequest、CSS/JS/字体加载、甚至 Service Worker 请求 —— 这些是 HTML 属性完全管不到的。
必须注意:
-
always参数很关键:确保 4xx/5xx 错误页也生效,避免敏感路径(如/admin?session=abc)在报错时意外泄露 - 响应头优先级最高,会覆盖
<meta name="referrer">和大部分元素级referrerpolicy(no-referrer除外) - CSP 中的
Content-Security-Policy: referrer no-referrer会覆盖<meta>,但不覆盖响应头
meta name="referrer" 已属遗留方案,慎用且不可依赖
<meta name="referrer" content="origin-when-cross-origin"> 只影响当前 HTML 文档后续自动触发的导航类行为:点击链接、<form></form> 提交(除非显式设了 referrerpolicy)、<img src> 加载等。但它对以下场景完全无效:
-
fetch()、XMLHttpRequest、动态插入的<img> -
window.location.href、location.replace()、<iframe></iframe>加载 - 用户右键“在新标签页中打开”
- 搜索引擎点击进来的首次访问
更麻烦的是:它的优先级低于响应头,若后端已配 Referrer-Policy,该 <meta> 就被静默忽略;Safari 对其支持一直较弱,不建议作为主力策略。











