Hugo 网站优化(6): 博客图片不能显示， 全怪 Adblock。

原文链接: https://tangx.in/posts/2023/01/01/no-referrer-when-downgrade-image/

我在 博客 老麦的书房 上， 放了几个推广链接， 等待好心人帮我点一点。

但是今天换了一台电脑后， 发现推广链接突然不能显示了。

打开调试模式， 发现图片报红， 报错 Referrer Policy: no-referrer-when-downgrade 。

经过搜索， 提示发现这个是 浏览器的安全策略 ， 不能从 https 的网站访问 http 的资源， 这个过程被称为 降级 。

no-referrer-when-downgrade

Send the origin, path, and querystring in Referer when the protocol security level stays the same or improves (HTTP→HTTP, HTTP→HTTPS, HTTPS→HTTPS). Don't send the Referer header for requests to less secure destinations (HTTPS→HTTP, HTTPS→file).

但是很奇怪， 从图片中可以看到， 在 Request Header 中， 图片地址 与 Referer 都是 https://tangx.in/ ， 不存在 跨域 ， 也不存在 降级 。

问题原因与解决方法

后经排查， 是 AdBlocker 搞的鬼。

在关闭 AdBlocker 之后， 这些推广图片能正常显示。

经过测试， 确认： 所有不显示的图片都具有共同路径， /tuiguang/， 这个路径应该是在 AdBlocker 的黑名单中。

于是 修改图片地址后，问题解决。

后记

功能本身一切正常， 而在生产环境缺出现了问题。 甚至再之前的电脑上面也装了另一个不同版本的 AdBlocker， 这种图片都能正常显示。 真实环境 真是太复杂 了。

怪不得， 现在为了隐藏 特征， 使用各种 混淆 方式。 在数据通信中是 加密通信 这样， 在前端 class 防爬虫 中也是这样， 躲避广告屏蔽还是这样。

参考资料