标签的referrerpolicy必须显式设置，因对资源加载完全无效——浏览器解析html早期即同步发起请求，而在dom构建后才生效，时机错位导致策略失效；不设则默认no-referrer-when-downgrade，https→https跨域时仍泄露完整路径如/admin?token=xyz。
link标签的referrerpolicy为什么必须显式设置
link 标签（比如加载字体、CSS、预连接）发起的请求，完全不受 <meta name="referrer"> 控制。浏览器在解析 HTML 早期就同步发出这些请求，而 <meta> 要等到 DOM 构建阶段才生效——时机错位，策略直接失效。不加 referrerpolicy，默认用 no-referrer-when-downgrade，HTTPS→HTTPS 跳转时 Referer 仍带完整路径，例如 /dashboard?token=xyz 会原样发给 Google Fonts 或 CDN。
- 默认策略对隐私不设防：它只在降级到 HTTP 时清 Referer，跨 HTTPS 域名照样暴露敏感路径
-
<meta name="referrer">对<link>完全无效，不是“没配好”，是根本不起作用 - 拼写错误（如
referrerpolicy少个e）或大小写错误（如Strict-Origin-When-Cross-Origin）会导致浏览器退化为默认策略
哪些link场景最易泄露路径，该怎么配
字体、CDN CSS、预加载资源这三类 link 最常把内部路由结构暴露给第三方：
-
<link rel="stylesheet" href="@#@#@#@#@#@#@#@#@#@0;%EF%BC%9AReferer%20%E6%98%AF%E4%BD%A0%E5%BD%93%E5%89%8D%E9%A1%B5%E5%AE%8C%E6%95%B4%20URL%EF%BC%8CGoogle%20Fonts%20%E5%B0%B1%E7%9F%A5%E9%81%93%E7%94%A8%E6%88%B7%E6%AD%A3%E8%AE%BF%E9%97%AE%20/admin/settings%20%20 <link%20rel=" preload as="style">：若未设策略，Referer 含查询参数，可能泄露?v=20260818或调试标记<link rel="preconnect" href="@#@#@#@#@#@#@#@#@#@2;%EF%BC%9A%E8%99%BD%E4%B8%8D%E5%8F%91%E5%AE%9E%E9%99%85%E8%AF%B7%E6%B1%82%E4%BD%93%EF%BC%8C%E4%BD%86%E9%83%A8%E5%88%86%E6%B5%8F%E8%A7%88%E5%99%A8%E4%BB%8D%E9%99%84%E5%B8%A6%20Referer%EF%BC%8C%E5%B0%A4%E5%85%B6%E5%9C%A8%E9%87%8D%E5%AE%9A%E5%90%91%E9%93%BE%E4%B8%AD%20%20
%E6%8E%A8%E8%8D%90%E9%85%8D%E7%BD%AE%E6%96%B9%E5%BC%8F%EF%BC%9A
- %E5%AD%97%E4%BD%93/%E5%A4%96%E9%83%A8%20CSS%EF%BC%9A
referrerpolicy=" no-referrer> —— 防止 origin 校验失败，也避免路径泄露 - 同域 CSS/JS：
referrerpolicy="strict-origin-when-cross-origin"—— 同源保留路径供调试，跨域自动收缩 -
rel="preconnect"或rel="dns-prefetch"：可省略，这类提示性 link 通常不触发 Referer，但加referrerpolicy="origin"更稳妥
referrerpolicy="origin" 和 "no-referrer" 在 link 上的区别
对 link 标签，这两个值的行为差异直接影响资源能否正常加载：
-
referrerpolicy="no-referrer"：请求头里压根没有Referer字段，适合 CDN 白名单宽松、或完全不想暴露来源的场景 -
referrerpolicy="origin"：发送@#@#@#@#@#@#@#@#@#@3（不含路径），适合需要 origin 校验但拒绝路径泄露的服务（如某些字体 API） -
referrerpolicy="strict-origin-when-cross-origin"：同源发完整 URL，跨源只发 origin —— 若你同时用自建 CSS 和 Google Fonts，这是更平衡的选择
注意：rel="preload" 必须带 as 参数，否则多数浏览器忽略；referrerpolicy 在它上面有效，但不会改变 preload 的优先级或触发时机。
容易被忽略的坑：HTTP 响应头比 HTML 属性更可靠
你在 link 上加了 referrerpolicy="origin"，但 CDN 返回的响应头是 Referrer-Policy: unsafe-url，最终行为以响应头为准——HTML 属性会被覆盖。反过来，如果服务端没配头，仅靠 HTML 属性，又存在两个硬伤：
- 页面 404/500 错误页不会继承该属性，而错误页 URL 往往含敏感参数（如
/api/users/123?session=abc） - JS 动态插入的
link（如 lazy load 字体）无法继承已有属性，必须手动设置
真正稳的做法是后端统一加响应头：add_header Referrer-Policy "strict-origin-when-cross-origin" always;。其中 always 关键字确保错误页也生效，避免报错时 Referer 裸奔。
复杂点在于：HTML 层面的 referrerpolicy 只管它自己这一条请求，没法约束后续 JS 发起的 fetch() 或 XMLHttpRequest。那些请求的 Referer 由页面级策略或响应头决定，和单个 link 无关。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
