复制微信公众号图片不能用，防盗链问题

最新推荐文章于 2025-02-04 16:14:13 发布

Jack2013tong

最新推荐文章于 2025-02-04 16:14:13 发布

阅读量1.4k

点赞数

文章标签：微信 dubbo

原文链接：https://zhuanlan.zhihu.com/p/519251963

版权

问题起因很简单，直接复制的公众号文章到网站，不单独处理图片，复制出来的文章图片因为微信防盗链设置不能显示出来，如下图

防盗链原理就是后端先拦截请求获取其中的referrer,将其和自身的白名单、本地域名等对比,符合条件的将通过,不符合的将会统一返回一个错误提示(可以是图片、文字等)。

那我们绕过referrer检查不就可以了,改一下Referrer Policy

开始是设置了全局meta的referrer（查了好多帖子都是这么写的）

<meta name="referrer" content="same-origin">

这么改会导致网站引用的百度统计失效，因为百度统计需要获取到referrer才会返回，否则返回空。

那就改一下不在head中添加，改为在<script>代码块里引用百度统计后，动态添加meta标签

const meta = document.createElement('meta');
meta.content='same-origin';
meta.name='referrer';
document.getElementsByTagName('head')[0].appendChild(meta);

这样就完美解决了微信图片不显示问题，同时不影响百度统计使用

PS:作者的碎碎念时间

Chrome浏览器从85版本后将原来的Referrer Policy默认值改为了strict-origin-when-cross-origin这个策略

从MDN上查一下这个策略，中文版是这么写的

strict-origin-when-cross-origin

对于同源的请求，会发送完整的URL作为引用地址；在同等安全级别的情况下，发送文件的源作为引用地址 (HTTPS->HTTPS)；在降级的情况下不发送此首部 (HTTPS->HTTP)。

作者理解这句话的意思是只对同源请求发送referrer，这就引发了一个思考默认这个策略的情况下百度统计等第三方软件是如何拿到referrer来做统计的？实际测试一下，默认情况下也发送referrer地址啊，这不对啊，怎么跟我理解的不一样？

重回MDN英文版，这么写的

strict-origin-when-cross-origin(default)

Send the origin, path, and querystring when performing a same-origin request. For cross-origin requests send the origin (only) when the protocol security level stays same (HTTPS→HTTPS). Don't send the Referer header to less secure destinations (HTTPS→HTTP).

这句话的意思是