img标签src为网络地址无法显示图片问题解决

461 阅读1分钟

网络图片无法显示,查看控制台,请求状态为403 Forbidden

问题所在:
http请求头中有一个referrer字段,用来表示发起http请求的源地址信息
服务器端在拿到这个referrer字段后判断请求是否来自本站,若不是则返回403,从而实现图片的防盗链

上面出现403是因为,请求的是别人服务器上的资源,但把自己的referrer信息带过去了,被对方服务器拦截返回403. 在前端可以通过meta来设置referrer policy(来源策略),referrer设置成no-referrer,发送请求不会带上referrer信息,对方服务器也就无法拦截了

解决方法:

<head>
     <meta name="referrer" content="no-referrer">
 </head>

也可以对单个连接设置 如:

<img rel="no-referrer" src="logo.png" />
<a rel="no-referrer" href="http://www.baidu.com" />百度</a>