对于不少自己搭建博客的人来说,使用什么图床可能比较难以选择,以前还有各种免费好用的图床工具,例如七牛云、SM.MS、Imgur、GitHub、微博图床等,当然还有腾讯云、阿里云的云存储服务,但是免费的意味着不稳定,说不定哪天图片就没有了,有一些国外的访问速度又不行,国内的云存储服务商价格也比较高,而且单一个博客也不需要太大空间,有点浪费。
本来刚刚开始写博客时用的是七牛云,后来涨价了,转到免费的 微博图床 。用了好几年没啥问题,没想到最近【2019 年 4 月份】微博图床出问题了,所有图片全部挂掉,访问图片链接全部是返回 403 状态码,表示拒绝访问,其实是微博图床开启了防盗链,本文就提供了一种简单有效的解决方案。
问题
随机抽了一些图片链接在浏览器中直接打开看,发现是可以看到图片的,然后在博客中还是看不到图片,如果在博客中选择图片链接,使用右键 在新标签页中打开 ,也是不能看到。这就说明微博图床开始检测请求的合法性了,对于不正常的请求统统拒绝。
当然,如果直接使用图片的链接在浏览器中单独打开,是可以看到图片的,紧接着在博客中就可以看到对应的图片了,但是这并不是说明图片可以使用了,其实是浏览器的缓存作用,如果及时清除浏览器的缓存,发现又不能使用了。
原来,近期微博图床对图片 CDN 添加了引用来源【Referer】检测,非微博站内引用将会返回 403 错误码,即拒绝访问。那能不能伪造或者清除这个参数呢,其实是可以的,只不过伪造、清除都需要增加一些 Javascript 动态脚本来处理,需要一些技术支持。
如果选择清除 Referer 参数,可以先验证一下,把图片的链接直接复制到浏览器中访问,就不会有这个参数,发现可以正常访问,没有 403 错误
解决
在静态网页的head 标记中添加如下配置项:1
<meta name="referrer" content="no-referrer" />
它的作用就是阻止浏览器发送 Referer 信息,对整个页面的所有链接生效。
这样一来微博图床就不知道请求的引用来源了,可以达到和直接在浏览器中访问一样的效果。 但是要注意,不是每种浏览器都支持这种语法的,此设置对有的浏览器来说无效。
那么在 Hexo 框架中怎么增加呢,显然不会有相关配置项,只能更改源代码,而且使用了 Next 主题,应该要更改主题的源代码,以保证 Hexo 在渲染静态页面为每个页面都增加这个配置。查阅文档,了解了渲染模板所在位置,打开 themes/next/layout/_partials/head.swig 文件,在里面添加 meta 标记就行。
修改完成后查看页面的源代码,已经有这个属性了,并且所有的图片都可以正常访问了,完美。
后续肯定会抽时间迁移图床的,先用着吧