Markdown图片显示问题解决

解决百度贴吧和bilibili等多个网站图片无法显示的问题

图片的防盗链

随着互联网的普及，网站之间的图片资源共享变得越来越普遍。然而，一些不法分子会试图盗用其他网站的优质图片，将其嵌入自己的网站中，以增加网站的吸引力和流量。为了保护自己的图片资源，许多网站采用了图片防盗链技术。

图片防盗链的实现原理基于HTTP协议中的Referer字段。当一个网页请求另一个网页时，HTTP请求头中会包含一个Referer字段，该字段记录了发起请求的原始网页地址。图片服务器可以通过检测Referer字段来判断请求是否来自指定的域名范围。如果请求的Referer值不符合预设的条件，图片服务器可以拒绝提供图片资源，从而防止盗链行为的发生。

解决的方案

  1. 修改图片服务器的配置文件，将Referer字段设置为允许访问的域名。或者删除 Header 中的 Referrer

content 有四个值可以选择 never,always,origin,default 这是来自于 whatwg 标准，浏览器对他的支持还是很好的。MDN 标准，还多了一个 no-referrer

1
<meta name="referrer" content="never">

  1. 在网页中添加Referer字段的验证逻辑，只有当Referer字段的值符合预设的条件时，才允许加载图片。

1
<img src="xxxx.jpg" referrerPolicy="no-referrer" />

  1. 使用后台的预下载（把图片下载下来放到服务器下）

语雀

转成md文件导出，图片无法正常显示。把url地址中png后面的部分，即#clientId开始全部删掉即可

hexo上传博客时

在md文件中加上meta标签即可保证图片都能正常显示，标签如下。

1
$ <meta name="referrer" content="no-referrer" />