解决防盗链导致图片不显示

当在自己的页面里用 <img src=”xxxx” /> 来引用其它网站的图片时，发现它的网站设置了防盗链策略，会在后台判断请求的Referrer属性是不是来自于一个非本域名的网站，如果来源不是本域名就返回 403 forbidden

有如下的解决方案

1.使用后台的预下载（把图片下载下来放到服务器下）

缺点：占用服务器的空间，访问速度没有原网站提供的稳定。有些网站是静态的如 hexo 就无法实现了

2.第三方代理

缺点：不稳点，第三方代理可能在国内访问不稳定。也可以自己做一个代理

下面有一个，url 后面填上网站 Api 返回的图片地址

<img src=”https://images.weserv.nl/url=https://img3.doubanio.com/view/photo/s_ratio_poster/public/p2544866651.jpg" />

3.上传 CDN 调用 CDN 的地址

缺点：有点奢侈，因为所有图片都存到 CND 占用大量空间，CND 可能需要钱购买，CND 服务商可以提供图片上传的 API

4.删除 Header 中的 Referrer

content 有四个值可选择 never,always,origin,default，这是来自 whatwg 的标准，浏览器对其支持还是很好的

MDN 标准，还多了一个 no-referrer

5.添加 ReferrerPolicy 属性

添加 meta 标签相当于对文档中的所有链接都取消了 referrer，而ReferrerPolicy 则更精确的指定了某一个资源的referrer策略。

关于这个策略的定义可以参照MDN。比如我想只对某一个图片取消referrer，如下编写即可:

<img src="xxxx.jpg" referrerPolicy="no-referrer" />