图片链接403

图片链接403

前阵子在用vue富文本编辑器vue-quill-editor的时候碰见个问题就是用户从文档上直接粘贴过去的图片保存后链接没问题，但页面展示不出来F12打开看，图片链接显示403。

原因

http请求体的header中有一个referrer字段,当一个用户点击当前页面中的一个链接，然后跳转到目标页面时，目标页面会收到一个信息，即用户是从哪个源链接跳转过来的,
之所以会出现从word文档粘贴过来的图片会显示不了，原因在于我们
前端的页面访问时带上我们自己的referrer,文档服务器端在拿到这个referrer值后就可以进行相关的处理,可以根据这个referrer来判断该请求是否来自本站，不是则返回403,从而实现图片的防盗链。
上面出现403就是因为，请求的是别人服务器上的资源，但把自己的referrer信息带过去了，被对方服务器拦截返回了403。

解决方案

在pubilc文件夹中的index.html的head中添加如下代码即可：