vue项目里面使用脚手架实现跨域

今天在作vue项目的时候,项目在本地,接口数据在阿里云,这就形成了跨域,在网上找了很久,网上大部分的方法都是找到config文件夹下面的index进行修改的,但是我找到的Index却和他们描述的不同。后来找到了一个比较适合小白实现的方法。vue

 首先在vue项目的根目录下建一个vue.config.js文件,vue.config.js里面的代码是这样的:ios

module.exports = {
  publicPath: '/',
  devServer: {
    proxy: {
      '/api': {
        target: 'http://121.41.9.242:8082',  //这里是目标服务器地址
        changeOrigin: true,
        ws: true,
        pathRewrite: {
          '^/api': '' "       //这里必定要为空
        }
      }
    }
  }
}
"^/api":后面必须为空。这样vue.config.js就搞定了。
而后就是发送网络请求了,我看的大佬的那篇文章,其余都很好,就是网络请求哪里没说的很清楚,我写好vue.config.js后网络请求那里还搞了一个小时才弄好。
网络请求须要这样发:
let { data } = await this.$axios.post(
          "/api/inside/user/findUserByUserId",
          null,
          {
            params: {
              userId: this.id
            }
          }
        );
本来后端给个人接口是这个:http://121.41.9.242:8082/inside/user/findUserByUserId
如今我发网络请求的接口是这样:/api/inside/user/findUserByUserId,用/api代替前面的目标服务器地址,这样就好了。
相关文章
相关标签/搜索