昨天遇到一个 非法referer 请求的问题,关键是测试环境可以,但是本地使用代理就不行。
referer :是http请求头中自动加上的一个属性,标识的是网站来源,可以利用referer规避非法请求。例如:我这个网站只允许指定域名才可以访问,使用Locahost就请求不到接口信息。
最后这个问题是一个后端问题,但是由此我在这个事情上纠结了一天,一直以为是本地请求的地址不对。
解决问题过程中一些比较疑惑的点,在此记录。
Q: 在 axios.defaults.baseURL 中设置了url地址为 / 之后为什么本地代理拦截不到请求呢?
A:可以请求到,请求不到说明可能是凭证没有拿到。需要在代理里面配置【目标访问地址】,【cookie】信息。
Q: 如果可以使用 axios.defaults.baseURL 那么使用 proxy 又有什么用呢?
A:如果设置了 axios.defaults.baseURL ,如果没有按照指定的规则是匹配不到的,也就不会使用本地代理了,走的就是 axios 的配置。
Q: 为什么有的时候需要将target设置成远程地址才可以?
A:因为本地的 serverUrl 配置成了测试环境的地址,如果把 serverUrl 改成【/】,本地代理配置下面的配置就会拦截请求地址,然后利用代理将远程地址转成本地的地址(服务端和服务端可以通信,服务端和浏览器端存在同源问题,会产生跨域问题),然后看到请求地址会是以【 http://localhost:8080/xxx 】开始的,但是调的接口是测试环境的接口,此时不用前端手动 setCookie 就可以本地启动&访问了。
基础配置项说明:
参考1
我也模拟了这套项目,在这个坑里爬了两天,讲师的课程是17年的东西有点了变化。废话不多说直接上货
在webpack.dev.conf.js里
// 需安装express和axios才能引用const axios = require('axios')
const express = require('express')
const app = express()
const apiRoutes = express.Router()
app.use('/api', apiRoutes)
在本文件的devServer对象里写入这句就行了
before(app) {app.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.response)
})
})
app.get('/api/lyric', function (req, res) {
var url = 'https://c.y.qq.com/lyric/fcgi-bin/fcg_query_lyric_new.fcg'
axios.get(url, {
headers: {
referer: 'https://c.y.qq.com/',
host: 'c.y.qq.com'
},
params: req.query
}).then((response) => {
var ret = response.data
if (typeof ret === 'string') {
var reg = /^\w+\(({[^()]+})\)$/
var matches = ret.match(reg)
if (matches) {
ret = JSON.parse(matches[1])
}
}
res.json(ret)
}).catch((e) => {
console.log(e)
})
})
}
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)