vue跨域代理的设置

假如你要用的接口是：http://jspang.com/DemoApi/oftenGoods.php

第一步：找到config文件夹中的index.js设置pxoxyTable

dev: {

    proxyTable: {
    '/api': {
    target: 'http://jspang.com/', // 设置你调用的接口域名
    changeOrigin: true, // 是否跨域
    pathRewrite: {
    '^/api': '/'      // 这里可以理解为用‘/api’来代替target里面的地址，例如我们调用http://jspang.com/DemoApi/oftenGoods.php，直接写成‘/api/DemoApi/oftenGoods.php’就可以了
    }
    }
    },

}

第二步：开发环境和生产环境的配置

在config/dev.env.js和prod.env.js里也就是开发/生产环境下分别配置一下请求的地址API_HOST

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"', // 开发环境
  API_HOST: '"/api/"'

})

module.exports = {
  NODE_ENV: '"production"', // 生产环境
  API_HOST: '"http://jspang.com/"'

}

第三步：调用

created() {
console.log(process.env.NODE_ENV, '环境')
let urlHost = process.env.API_HOST // 会自动判断当前是开发还是生产环境，然后自动匹配API_HOST
  axios.get(urlHost + 'DemoApi/oftenGoods.php')
.then((res) => {
console.log(res, '代理之后')
})
},