axios跨域请求

第1步：项目根目录下创建vue.config.js文件，内容如下

const path = require('path');

const resolve = dir => {

  return path.join(__dirname, dir)

};

const serverProxy = {

  '/api': {

    target: 'http://139.155.114.8:20145',

    ws: true,

    changeOrigin: true,

    pathRewrite: {

      '^/api': ' '  //通过pathRewrite重写地址，将前缀/api_screen转为/

    }

  }

};

module.exports = {

    publicPath: process.env.NODE_ENV === 'production'

    ? './'

    : '/',

    lintOnSave: false,

    // 这里写你调用接口的基础路径，来解决跨域，如果设置了代理，那你本地开发环境的axios的baseUrl要写为 '' ，即空字符串

    devServer: {

      host:'0.0.0.0',

      proxy: serverProxy

    }

}

 

第2步：main.js文件

import Axios from 'axios';

Vue.config.productionTip = false;

Vue.prototype.$axios = Axios;

Axios.defaults.baseURL = '/api';

 

第3步：this.$axios.post('接口地址', 参数(json格式), config)

this.$axios.post('/InterfaceSrv.asmx/ElecInterface', {"IN":[{"TradeID":"A001","UnitID":"1","DevID":"1","DevPsw":"123456","OpAccount":this.textVal,"OpPsw":this.passWordVal,"HappenTime":this.currentTime,"SignIn":"5FD86E9AD5CEDC6E45551E2E2057B14C145CF525AE1EF1FD220D1FC7DBC8184EBAAADFB56A574CDA"}]}, {headers:{'Content-Type':'application/x-www-form-urlencoded'}}).then((res) => {

        console.info(res);

      }).catch((err) => {

        console.info(err);

      });