一个拼写错误让整个互联网一起犯错
在 Web 开发的世界里,有这样一个字段——它每天默默地工作着,记录着用户的来源,保护着网站的安全,却因为一个历史性的拼写错误而成为了程序员们茶余饭后的谈资。它就是 HTTP 头部中的 Referer 字段。
什么是 HTTP Referer
HTTP Referer 是一个请求头字段,用于告诉服务器用户是从哪个页面链接过来的。当你从一个网页点击链接跳转到另一个网页时,浏览器会自动在新的 HTTP 请求中添加 Referer 头,其值为上一个页面的 URL。
Referer: https://example.com/page1.html
这告诉服务器,用户是从 https://www.example.com/page1.html 这个页面跳转过来的。
核心作用
1. 流量来源分析
网站运营者可以通过分析 Referer 信息了解:
用户从哪些网站访问过来 哪些页面是主要的流量入口 外部链接的效果如何 用户的浏览路径和行为习惯
2. 防盗链保护
许多网站利用 Referer 来防止其他网站直接链接自己的图片、视频等资源。服务器可以检查 Referer 是否来自允许的域名,如果不是则拒绝请求。
# nginx 图片防盗链配置
location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
valid_referers none blocked server_names
*.mysite.com *.mydomain.com;
if ($invalid_referer) {
return 403;
}
}
3. 安全防护
用于 CSRF 攻击防护和恶意请求检测:
# nginx CSRF 攻击防护
location /api {
valid_referers none blocked server_names *.example.com;
if ($invalid_referer) {
return 403;
}
proxy_pass http://backend;
}
这样就可以检查请求是否来自合法域名(*.example.com)。
著名的拼写错误
HTTP Referer 存在一个著名的拼写错误:正确的英文单词应该是 "Referrer",但在 1995 年制定 HTTP/1.0 规范时被误写为 "Referer"(少了一个 r)。
当错误被发现时,HTTP 协议已经广泛部署,为保持向后兼容性,这个拼写错误被永久保留:
HTTP 头部:使用错误拼写 RefererHTML 属性:使用正确拼写 referrer
<!-- HTML中使用正确拼写 -->
<metaname="referrer"content="origin">
<!-- HTTP头中使用错误拼写 -->
Referer: https://example.com
Referrer-Policy 策略
为了解决隐私问题,W3C 制定了 Referrer Policy 规范,提供了精细的控制机制,现代浏览器支持 Referrer-Policy 来控制 Referer 的发送行为:
策略值
no-referrer | ||
no-referrer-when-downgrade | ||
origin | ||
origin-when-cross-origin | ||
same-origin | ||
strict-origin | ||
strict-origin-when-cross-origin | ||
unsafe-url |
设置方法
HTTP 响应头:
res.setHeader('Referrer-Policy', 'strict-origin-when-cross-origin');
HTML Meta 标签:
<metaname="referrer"content="strict-origin-when-cross-origin">
元素级别控制:
<ahref="https://external.com"referrerpolicy="no-referrer">外部链接</a>
<imgsrc="image.jpg"referrerpolicy="origin">
rel 属性相关值
noreferrer
阻止发送 Referer 头:
<ahref="https://external.com"rel="noreferrer">不发送Referer</a>
noopener
防止新窗口访问原窗口对象:
<ahref="https://external.com"target="_blank"rel="noopener">安全新窗口</a>
nofollow
告诉搜索引擎不要跟踪链接:
<ahref="https://untrusted.com"rel="nofollow">不被索引的链接</a>
组合使用
<ahref="https://external.com"
target="_blank"
rel="noopener noreferrer nofollow">
完全安全的外部链接
</a>
总结
HTTP Referer 虽然只是一个小小的请求头,但它承载着 Web 发展的历史,见证了互联网从功能至上到隐私保护的转变。那个著名的拼写错误也提醒我们,技术标准的制定需要更加严谨和谨慎。
👨💻欢迎关注我的公众号「程序员wayn」,技术成长社群正招募热爱coding的你,加入我们,一起深入探讨技术、分享经验、共同成长!
作者原创技术好文推荐: