刚搭建好了hexo博客，写了一篇带图的文章，结果发现图挂了…之前看博客扫到hexo博客显示本地图片可能会有问题，于是选了图床图片的方式插图，结果还是没能幸免，好在搜索了半天，解决了这个问题，这里做个记录，帮助后面遇到问题的同学。
解决方案：
问题情境：
在自己电脑的Chrome浏览器查看博客，正常显示图片，切换到Safari、火狐浏览器图片挂了。 手机端各浏览器均显示不了图片。
解决步骤：
- 分析
-
检查图床图片的链接：
点进去发现图片正常显示，排除图床服务器问题。
-
用Chrome打开博文，右键检查或者查看网页源码：
找到图床图片链接，点击发生403(Forbidden)错误，找到问题根源。
-
解决
403 forbidden，说明了这个网络资源这样获取是被拒绝的，那么通过简单的谷歌，找到了相关的解决方法，并去实际尝试：
解决方法 ：只需要在markdown文章开头添加一个
<meta name="referrer" content="no-referrer" />然后就是
hexo clean && hexo g && hexo d上传博客了，这一次分别在电脑和手机端打开文章，图片显示正常，问题解决。
原理解析：
为了不做一个只会搬运的码农，这里简单讲解一下原理：
- HTML的 标签提供了 HTML 文档的元数据。元数据不会显示在客户端，但是会被浏览器解析。这也是为什么加在mardown文章里不会看到这段代码的原因。
- HTML 的 name 属性规定了元数据的名称，这里我们用到的是referer属性，这个属性的作用是让服务器判断来源页面，即用户是从哪来的，很多时候referer被当做防盗链来使用，服务器根据你的访问来源判断是否应该让你下载这个资源，如果你的来源不和规范，比如是个恶意爬虫，那么就会产生403错误。
- 到这里，
content="no-referrer"的意义就呼之欲出了，既然我们想拿到这个资源但被服务器认出来之后又被拒绝了，那么伪装一下，不告诉服务器不就行了？所以，这里content的no-referer就是表示不发送引用数据，隐藏自己的来源信息。这样，图片就能正常显示了。