hexo博客使用的一些常见问题(一):外站图片显示,站内链接,嵌入B站视频
1、关于网站使用外网图片无法显示的问题。
- 如果只需要文章能够正常显示,只需要在文章前面最前方加上如下语句即可:
1 | <meta name="referrer" content="no-referrer" /> |
该方法参考这篇文章的说法:https://www.cnblogs.com/selier/p/9570650.html, 大致的原理是:
一般浏览器向服务器请求一个资源(如图片)时,通常会包括一个
Referer
头部,它包含了发起请求的页面的URL。这有助于服务器理解请求的来源。 而有些图片网站为了防止其它网站盗链其资源(比如我是直接吧图片上传到gitee中,然后再文章中加载)。如果
Referer
头部显示图片请求来自于非授权的域名,服务器可能拒绝请求。 所以该条语句的意思是:告诉浏览器不要发送
Referer
头部给服务器。这样,图床服务器就无法判断请求是否来自于非授权的域,因而可能“默认”允许请求。
当然如果不想每次创建文章的时候都手动添加该语句,可以尝试把该语句添加到hexo博客更目录下的scaffolds/post.md
文件中,该文件是创建文章的模板文件,此时我们通过hexo n “文章题目”的时候会自动添加该语句。
我在实际的建立博客的时候,可能由图床文件,并不仅仅用在文章中,可能还希望应用到各种页面中,比如主页头像,其他网页内容,这个时候通过向文章头部添加这条语句的方法就不行了,这是我们可以采用hexo的
注入器(Injector)
往所有的博客页面头部注入该条语句,以实现全网的图片访问。具体做法如下:- 在hexo博客根目录下添加
scripts
文件夹,在文件夹中创建injector.js
文件,在该文件中添加如下语句:
1
hexo.extend.injector.register('head_begin', '<meta name="referrer" content="no-referrer">', 'default');
- 允许
hexo cl
(清除缓冲),hexo g
(重新生成静态文件),hexo s
(本地启动服务查看效果),hexo d
(部署到服务器),来实现网站部署,此时就可以正确的显示了。
- 在hexo博客根目录下添加
2、 关于博客内部链接的问题。
- 把
permalink
修改为:title/
1 | # URL |
- 文章直接做链接,按照
/目录/文章名称/
作为链接内容即可,会自动链接到网址//目录/文章名称/
对应的网页中
3、 在博客中嵌入视频(比如B站视频)
- 直接在markdown中使用
<iframe>
标签,在标签中添加视频的网址,即可嵌入视频,如下图 - 视频的网址,比如B站的视频,可以在视频下方的分享按钮,有一个嵌入代码,直接复制代码即可,如果嵌入到markdown中,视频比较小,可以在
iframe
中添加width
和height
属性,设置视频的宽度和高度,如下所示
```yaml
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 SenySunny!
评论