Django-----跨域配置&axios

一, vue端

vue跨域配制(第一种方法)
在config文件夹下的index.js中配制
    proxyTable: {
    '/api': {  //使用"/api"来代替"http://f.apiplus.c" 
    target: 'http://127.0.0.1:8000/', //源地址 
    changeOrigin: true, //改变源 
    pathRewrite: { 
      '^/api': '' //路径重写 
      } 
  } 
},

二,Django端

跨域(第二种方法)
用Django的第三方包 django-cors-headers 来解决跨域问题
操作步骤:
1.pip install django-cors-headers
2.在settings.py中添加'corsheaders.middleware.CorsMiddleware',在SessionMiddleware和CommonMiddleware的中间
3.在settings.py中添加CORS_ORIGIN_ALLOW_ALL = True

三,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);
});

在main.js里配置,该两行
import axios from 'axios'
Vue.prototype.axios = axios   //其它组件可以使用this.axios

原文地址:https://www.cnblogs.com/xinzaiyuan/p/12382555.html