一、什么是Referrer Policy
在谈论Referrer Policy之前,我们需要了解一下HTTP Referer头。当我们在浏览器地址栏输入一个URL或点击一个链接,浏览器就会向该URL发送一个请求,其中会包含头部信息,其中包括HTTP Referer头。该头部信息用来告知服务器当前请求的来源地址,供服务器做出相应的应答。
而Referrer Policy就是一种对于HTTP Referer头的控制,它可以控制当前页面向目标链接发送请求时,是否要发送该页面URL作为来源地址。其中包括以下设置:
Referrer-Policy: no-referrer Referrer-Policy: no-referrer-when-downgrade Referrer-Policy: origin Referrer-Policy: origin-when-cross-origin Referrer-Policy: same-origin Referrer-Policy: strict-origin Referrer-Policy: strict-origin-when-cross-origin Referrer-Policy: unsafe-url
不同的设置可以控制Referrer头的不同行为方式。例如,no-referrer就是不发送Referrer头;origin可以仅发送源地址;same-origin可以发送同域名下的地址,但不发送跨域地址。
二、Referrer Policy的应用场景
1、避免信息泄露问题:当我们从自己的网站跳转到别人的网站时,如果当前网站发送了Referer头,就可能会泄露当前网站的信息到目标网站中,从而引发安全问题。这时可以使用Referrer Policy来控制是否发送该头部信息。
2、减少流量损失:在一些情况下,我们使用一些第三方资源或者CDN服务会涉及到跨域问题,如果我们直接使用其提供的URL作为资源地址,则会包含完整的当前页面URL作为来源地址,从而增加了额外的流量损耗。这时候可以使用Referrer Policy来控制将当前页面URL作为来源地址发送的行为。
三、Referrer Policy的具体设置方法
在HTML中,我们可以通过设置 标签来设置Referrer Policy:
<meta name="referrer" content="no-referrer">
如果需要在HTTP header中设置,可以使用以下语句:
Referrer-Policy: no-referrer
四、Referrer Policy的实际应用示例
接下来,我们通过一个实际应用示例来说明Referrer Policy的具体使用方式。假设我们使用了一个第三方的图片CDN服务,图片地址为:
https://cdn.example.com/image.jpg
我们此时需要在我们自己的网站中使用该图片,可以将以下代码嵌入HTML中:
<img src="https://cdn.example.com/image.jpg" referrer-policy="no-referrer" />
或者将以下代码添加到HTTP header中:
Referrer-Policy: no-referrer
这样可以有效地减少额外的流量损耗,同时也避免了信息泄露问题。
五、Referrer Policy的注意事项
1、一定需要注意当前网站的安全问题,在需要保证安全的场景中一定需要设置合理的Referrer Policy。
2、需要权衡当前页面的流量损失问题,避免过度损失。
3、不同浏览器对于Referrer Policy的支持程度不一,需要进行充分的兼容性测试。
六、总结
通过本文的介绍,我们了解了Referrer Policy的基本概念和相关设置方法,同时掌握了其在实际应用中的具体场景。在进行Web开发时,熟练掌握Referrer Policy的相关设置可以让我们更加有效地进行网站流量和安全的控制。