使用 hexo+github 搭建博客,图片成为一个头疼的问题,如果放在相对目录上,那么图片会占用空间,文章多了加载会变慢,所以我一直使用简书的图床。
但是发现hexo里加载不出简书图床上的图片,搜索了一波发现微博图床也有类似的问题,找到了原因,具体参考:
https://blog.gobyte.cn/post/cfce32d8.html
但是上述链接的脚本:
1 | var link = "" ; |
我发现并不好用,经过调试发现$(“img”)并不能取得页面所有的im g标签,我换成了document.getElementsByTagName('img')
的形式,可以取得所有的 img 标签(我用的是简书图床,所以关键字是jianshu)
1 | var link=""; |
但是发现还是无效,一顿调试发现浏览器根本不像代码注释那样面重新加载一次图片,而是使用原来的缓存(检测到src没有改变),遂参考如下链接:https://blog.csdn.net/maoxunxing/article/details/40618617 解决。
由于直接从上传到简书图床获得的链接中已经有?与参数,所以要把原先链接的?及后面参数删除(不影响显示图片)。
改上去发现还是不好使orz,继续调试发现img的标签referrerpolicy已经是no-referrer,抓包还是会有refer头,问题出在这里,一顿测后来在文档里发现属性应该是referrerPolicy…大写的P,没写过前端的痛。
贴上最终好用的代码:
1 | var link=""; |