vue跨域配制
Posted huanghaobing
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue跨域配制相关的知识,希望对你有一定的参考价值。
在config文件夹下的index.js中配制
proxyTable: { ‘/api‘: { //使用"/api"来代替"http://f.apiplus.c" target: ‘http://127.0.0.1:8000/‘, //源地址 changeOrigin: true, //改变源 pathRewrite: { ‘^/api‘: ‘‘ //路径重写 } } }
(第二种方法)
用Django的第三方包 django-cors-headers 来解决跨域问题
-
操作步骤:
-
pip install django-cors-headers
-
在settings.py中添加
corsheaders.middleware.CorsMiddleware
,在SessionMiddleware
和CommonMiddleware
的中间
3.在settings.py中添加CORS_ORIGIN_ALLOW_ALL = True
axios
-
安装 axios
cnpm install --save axios
-
配制axios
在src文件下的mian.js中配制
import axios from ‘axios‘
Vue.prototype.axios = axios
axios使用
?
axios完整写法:
?
this.axios({
method: ‘post‘,
url: ‘/user/12345‘,
data: {
firstName: ‘Fred‘,
lastName: ‘Flintstone‘
}
}).then((res)=>{
console.log(res)
}).catch((error)=>{
console.log(error)
});
post请求
this.axios.post(‘‘,{}).then((res)=>{}).catch((error)=>{})
get请求
axios.get(‘/user?ID=12345‘)
.then((response)=> {
console.log(response);
})
.catch((error)=> {
console.log(error);
});
以上是关于vue跨域配制的主要内容,如果未能解决你的问题,请参考以下文章