rel="noreferrer" 是唯一能真正阻止 referer 请求头发送的 html 原生方案，它作用于 标签点击跳转，被所有现代浏览器标准化支持，不依赖 js，兼容静态页、seo 与无障碍环境。
rel="noreferrer" 是唯一能真正阻止 Referer 请求头发送的 HTML 原生方案——不是隐藏，是压根不发。
为什么只用 rel="noreferrer" 就够了
浏览器对跨域跳转的 Referer 有硬性限制：JavaScript 无法伪造或覆盖它（比如设成 rock&roll.com），只有 rel="noreferrer" 被所有现代浏览器（Chrome 49+、Firefox 36+、Safari 10.1+、Edge 15+）标准化支持，且作用于点击行为本身。
它不依赖 JS，静态页、SEO、爬虫、无障碍环境全部兼容；右键“在新标签页打开”虽不受控，但这是设计使然，不是缺陷。
rel="noreferrer" 和 referrerpolicy 别混用
rel="noreferrer" 只管 <a></a> 标签的点击跳转，同时隐式启用 noopener（切断 window.opener），附带安全加固；referrerpolicy="no-referrer" 则用于 <img>、<script></script>、<iframe></iframe> 等资源请求，不处理 opener，也不影响右键新开。
若你在 <a></a> 上同时写：rel="noreferrer" referrerpolicy="no-referrer"，后者会被忽略——rel 属性优先级更高，且已覆盖全部需求。
哪些场景必须加，又容易漏掉
只要链接目标是第三方域名，且你不希望对方知道用户从你哪一页、哪个路径点进来的，就必须加。
常见漏点包括：
- 广告位、联盟链接、下载按钮（如
<a href="https://cdn.example.com/app.zip">下载</a>） - 后台管理页里的“查看官网”“跳转帮助中心”等外链
- 邮件模板中嵌入的 HTML 链接（很多 CMS 会自动 strip
rel属性，需检查输出逻辑） - 用
target="_blank"但只加了noopener没加noreferrer——这会照常发 Referer，隐私没保护
验证是否生效的实操方法
别只看代码，务必实测：
打开 Chrome DevTools → Network 标签页 → 点击那个外链 → 找到对应请求 → 查看 Request Headers 中的 Referer 字段是否存在、内容是否为空。
对敏感页面（如 /dashboard?token=abc），重点确认目标站是否收到完整 URL；若策略正确，该字段应完全缺失（不是空字符串，是压根没这个 header）。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
