vue 部分网络图片加载失败,控制台报错,http状态码403

vue项目中有时候请求网络地址的图片http状态码会报403错误

原因:

1.http请求头中有一个referrer字段,用来表示发起http请求的源地址信息
在这里插入图片描述
2. 服务器端在拿到这个referrer值后判断请求是否来自本站

若不是则返回403,从而实现图片的防盗链。上面出现403就是因为,请求的是别人服务器上的资源,但把自己的referrer信息带过去了,被对方服务器拦截返回了403

解决办法:

在前端可以通过meta来设置referrer policy(来源策略),referrer设置成no-referrer,发送请求不会带上referrer信息,对方服务器也就无法拦截了

在index.html中添加

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

猜你喜欢

转载自blog.csdn.net/c327127960/article/details/128953780