vue-cli3.0环境下使用proxyTable解决跨域问题

现在项目一般都进行前后端分离了。前后端服务器都不在一起，开发环境下，当协议、子域名、主域名、端口号中任意一个不相同时，算不同域，这个时候会出现跨域问题。

1.在config下index.js中proxyTable加上:

proxyTable: {

      '/api': {                                // 要代理的接口名

        target: 'http://39.108.102.200/',  // 要代理的后台接口地址

        changeOrigin: true,                            // 允许跨域

        pathRewrite: {'^/api': ''}            // 接口名重写

      }

 }

2.去main.js中配置

import axios from 'axios'

Vue.prototype.HOST = '/api'

Vue.config.productionTip = false

3.功能页面请求接口

axios({

           method: 'get',

            url: this.HOST + `接口`,

           }).then((res) => {

                console.log(res)

})

注意：这是在开发环境下的配置，生成环境下可以会Nginx反向代理