vue跨域问题解决

一般情况下，后端负责解决跨域问题，然而有的时候特别是请求第3方接口时，后端人员无法协调，那么就需要前端自己来解决跨域问题了，以下就是详细步骤。（听说有很多种方案，但是因为本人是菜鸟所以只学会1种，还得记在小本本上 防止下次有需要的时候忘记）

总共需要修改2个文件（此处以stock项目为例，stock文件夹就是项目文件夹的根目录）

1、stock/config/index.js 里面加入以下代码 （这里可以复制文本）

 proxyTable: {
      '/api': {
        target: 'https://www.xxx.cn/',//后端接口地址
        changeOrigin: true,//是否允许跨越
        pathRewrite: {
          '^/api': '',//重写,
        }
      }
    },

以上这段代码加到stock/config/index.js里面，具体位置如下图：

image.png

2、在请求接口的代码里面这样写：

 async getData() {
        let p = 'rp=50';
        let res = await this.$post('http://localhost:8080/api/data/list',p);
        console.log('test 得到的 res ---', res);
      },

以上代码中最重要的部分是请求地址的域名部分，请记得一定要写自己前端项目的域名而不是接口地址的域名！！！请记得一定要写自己前端项目的域名而不是接口地址的域名！！！请记得一定要写自己前端项目的域名而不是接口地址的域名！！！

代码解析如下图：

image.png

3、至此，跨域问题已解决。如果没有的话我直播吃翔。