脚本宝典收集整理的这篇文章主要介绍了记一次vue 使用axios跨域问题(CROS),脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
前端在axios中配置请求头
// An highlighted block
axios.defaults.headers.common['Authorization'] = 'aaa111222';
// 创建axios实例
const service = axios.create({
// axios中请求配置有baseURL选项,表示请求URL公共部分
baseURL: process.env.VUE_APP_BASE_API,
// 超时
timeout: 10000
})
service.interceptors.request.use(config => {
// 是否需要设置 token
const isToken = (config.headers || {}).isToken === false
if (getToken() && !isToken) {
config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
config.headers['Content-Type'] = 'application/json;charset=utf-8'
}
return config
}, error => {
console.log(error)
Promise.reject(error)
})
response.setHeader("Access-Control-Allow-Origin","*");
response.setHeader("Access-Control-Allow-Methods", "POST,GET,OPTIONS,DELETE,HEAD,PUT,PATCH");
response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, token,Authorization");
app.all("*",function(req,res,next){
//设置允许跨域的域名,*代表允许任意域名跨域
res.header("Access-Control-Allow-Origin","*");
//允许的header类型
res.header("Access-Control-Allow-Headers","Origin, X-Requested-With, Content-Type, Accept, token, Authorization");
//跨域允许的请求方式
res.header("Access-Control-Allow-Methods","DELETE,PUT,POST,GET,OPTIONS");
if (req.method.toLowerCase() === 'options')
res.send(200); //让options尝试请求快速结束
else
next();
});
以上是脚本宝典为你收集整理的记一次vue 使用axios跨域问题(CROS)全部内容,希望文章能够帮你解决记一次vue 使用axios跨域问题(CROS)所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。