http中的referer
最近做vue的一个项目的时候,需要抓取某q音乐的一些数据,分析了某q音乐Web上轮播图的图片和链接的数据传输,发现了是用通过jsonp来做的跨域处理。然后通过下面代码成功抓取到数据:import originJsonp from 'jsonp'export default function jsonp(url, data, option) {url += (url.ind...
最近做vue的一个项目的时候,需要抓取某q音乐的一些数据,分析了某q音乐Web上轮播图的图片和链接的数据传输,发现了是用通过jsonp来做的跨域处理。
然后通过下面代码成功抓取到数据:
import originJsonp from 'jsonp'
export default function jsonp(url, data, option) {
url += (url.indexOf('?') < 0 ? '?' : '&') + param(data)
return new Promise((resolve, reject) => {
originJsonp(url, option, (err, data) => {
if (!err) {
resolve(data)
} else {
reject(err)
}
})
})
}
export function param(data) {
let url = ''
for (var k in data) {
let value = data[k] !== undefined ? data[k] : ''
url += '&' + k + '=' + encodeURIComponent(value)
}
return url ? url.substring(1) : ''
}
export function getRecommend() {
const url = 'https://c.y.qq.com/musichall/fcgi-bin/fcg_yqqhomepagerecommend.fcg'
const data = Object.assign({}, commonParams, {
platform: 'h5',
uin: 0,
needNewCode: 1
})
return jsonp(url, data, options)
}
但是抓下面的歌单数据的时候用jsonp就请求不成功了,返回500状态码,是某q那边的服务器挂了吗,显然不是。
然后继续分析network里面的东西,发现多了一个referer和host,referer是什么东西呢:
HTTP中的Referer是header的一部分,当浏览器向web服务器发送请求的时候,一般会带上Referer,告诉服务器我是从哪个页面链接过来的,服务器基此可以获得一些信息用于处理。
简而言之,HTTP
Referer是header的一部分,当浏览器向web服务器发送请求的时候,一般会带上Referer,告诉服务器我是从哪个页面链接过来的,服务器藉此可以获得一些信息用于处理。比如从我主页上链接到一个朋友那里,他的服务器就能够从HTTP
Referer中统计出每天有多少用户点击我主页上的链接访问他的网站。
那么猜想某q音乐是不是通过这个对接口做了限制,他们只接受从特定页面发送过来的请求。
后来用axios后端代理成功抓取到,和AJAX同理
export function getDiscList() {
const url = '/api/getDiscList'
const data = Object.assign({}, commonParams, {
platform: 'yqq',
hostUin: 0,
sin: 0,
ein: 29,
sortId: 5,
needNewCode: 0,
categoryId: 10000000,
rnd: Math.random(),
format: 'json'
})
return axios.get(url, {
params: data
}).then((res) => {
return Promise.resolve(res.data)
})
}
修改dev-server.js文件,这里是后端Node的消息处理
增加代码:
var app = express()
var apiRoutes = express.Router()
apiRoutes.get('/getDiscList', function (req, res) {
var url = 'https://c.y.qq.com/splcloud/fcgi-bin/fcg_get_diss_by_tag.fcg'
axios.get(url, {
headers: {
referer: 'https://c.y.qq.com/',
host: 'c.y.qq.com'
},
params: req.query
}).then((response) => {
res.json(response.data)
}).catch((e) => {
console.log(e)
})
})
app.use('/api', apiRoutes)
捕捉到前台发送的请求,向header里面增加伪装属性referer和host。在把返回的数据以json形式发送回前端。
更多推荐
所有评论(0)