概述
准备通过vue全家桶仿制一个QQ音乐播放器,绝大多数根据网上抓取下来的API都是没有问题的。
在获取推荐歌单API的时候,发现接口老是返回invalid referer
,下面我们来看看这个提示到底是什么鬼。
Referer
HTTP Referer
是header
的一部分,当浏览器向web服务器发送请求的时候,一般会带Referer
,告诉服务器我是从哪个页面链接过来的,服务器基此可以获得一些信息用于处理。通俗的讲就是服务端辨识请求端的一个凭证,可以通过据此做一些请求限制。Referer
其实应该是英文单词Referrer
,最初拼写错了,之后大家也就都用着这个错误的写法了。查看MDN对referer
解释。
返回 invalid referer
服务端识别到请求端并不是在自己的域名下发起的请求,给定了返回提示 “这是我自己的接口,你们是访问不到的”。我们怎么去绕过referer
监测,或者说怎么伪造一个referer
去躲过服务端这个限制呢。
解决方案
1. 方案一
通过node
跟axios
设置referer
vue-cli 项目下找到build
文件夹下的webpack.dev.conf.js
文件,导入express
跟axios
。
在`devServer`最后加上`before`函数。
2. 方案二
通过webpack
反向代理proxyTable
里面的bypass
对请求头进行修改