vue-cli中webpack的跨域代理设置

首先我使用的Vue-cli2.x的版本,3.0的不知道怎么弄
一般在本地开发的话会碰到跨域的问题
其实坚决办法很简单,一个是让后端修改跨域限制
这里讲下proxyTable的配置

首先在目录里找到config->index.js->dev:{}
然后修改成

 proxyTable: {
      '/api': {
        target: 'http://xxx.xxx.x.x/',    //主域名   就是你真正要去请求的地方
        changeOrigin: true,   //允许跨域  
        pathRewrite: {
          '^/api': ''
        },
        secure: false
        //重写路径,其实这里就是和上面的target拼接起来
      }
    },

设置好后
加入用axios
import axios from "axios";

let url = "/api" + "/xxxxxxxxxxx";
    axios
      .get(url, {
        params: {}
      })
      .then(function(response) {
        console.log(response);
      })
      .catch(function(error) {
        console.log(error);
      });

这样子跨域问题就解决了,满足目前开发需求,dev下只在开发环境有限,生产的话都是基本都是同一个域名没什么关系.

你可能感兴趣的:(vue-cli中webpack的跨域代理设置)