axios+跨域+携带cookie

axios的使用

1. cmd下载
   npm i axios vue-axios
2. 在main.js中引入

import axios from 'axios'
import VueAxios from 'vue-axios'

Vue.use(VueAxios, axios);

跨域设置

1. 在config目录下的index.js的dev下配置

proxyTable: { //设置地址代理，跨域请求外部链接
    '/api': {
        target: 'http://00.00.00.00',//设置你调用的接口域名和端口号 别忘了加http
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
    }
},

跨域.png

2. 发送请求是加headers: {'Content-Type': 'application/x-www-form-urlencoded'},

this.axios({
  method: 'get/post',
  url: '',
  headers: {'Content-Type': 'application/x-www-form-urlencoded'},
  data: {}
}).then(function (res) {
  console.log(res.data)
}).catch(function (error) {
  console.log(error)
});

携带cookie

在main.js中加axios.defaults.withCredentials=true;见下图：

携带cookie

前后端数据交互