vue axios前端配合后端解决跨域问题,并将请求放在body中
axios跨域前端修改携带cookie 在axios创建时要加入withCredentials: true,默认withCredentials:false,是不会携带cookie的跨域需要携带两个参数config.data = JSON.stringify(config.data); config.headers = {Content-Type':'application/json' }。需要后端
·
axios跨域前端修改
vue axios请求跨域,网上资料一堆,有的用qs,还要在config文件夹下的index.js中修改proxyTable。如果后端配合的话,前端只需要做一些小修改,就能轻松实现跨域。
携带cookie 在axios创建时要加入withCredentials: true,默认withCredentials:false,是不会携带cookie的
axios.create({
baseURL: '//ott-mng.jd.com/', // api 的 base_url
timeout: 5000, // request timeout
withCredentials: true
})
跨域需要携带两个参数config.data = JSON.stringify(config.data); config.headers = {Content-Type’:‘application/json’ }。
axios.interceptors.request.use(
config => {
// Do something before request is sent
if (store.getters.token) {
// 让每个请求携带token-- ['X-Token']为自定义key 请根据实际情况自行修改
config.headers['X-Token'] = getToken()
}
config.data = JSON.stringify(config.data)
config.headers = {
'Content-Type': 'application/json'
}
return config
},
error => {
// Do something with request error
console.log(error) // for debug
Promise.reject(error)
}
)
需要后端配合,到这一步已经能解决跨域问题了。但是你会发现参数都是query请求,直接拼接在url后面。后端在body中拿不到数据,axios的post请求参数要写在data中,不是params
post请求需要加上method,不写的话默认get请求
request({
url: 'url1',
data: { a: 11, b: 2, c: 3 },
method: 'post'
})
get请求
request({
url: '/admin/user/selectById',
params: { id: 1 }
})
如有问题请联系我~
欢迎加入QQ群:
更多推荐
已为社区贡献5条内容
所有评论(0)