如何解决开发环境中的跨域问题(二)

1.创建 跨域浏览器(不够安全)

• 创建一个文件夹， C:\aaa

• 创建一个谷歌浏览器的快捷方式

•  在快捷方式点右键 =>属性=>目标，移动到最后，加入空格，粘贴   --disable-web-security --user-data-dir=C:\aaa

•  点击确定，打开后就是跨域浏览器

 2.反向代理

搭建一个服务器,将自己的请求通过这个服务器发送给到另一个服务器,服务器之间发送请求是不会出现跨域问题的

步骤如下:

在项目的

.env.development文件中(配置环境变量)

VUE_APP_BASE_API ='/abc'
//其中'xxx' 为任意名字

在vue.config.js中

devServer: {
...省略其他代码

    // 代理 解决跨域问题
    proxy: {
      '/abc': {
        target: 'http://localhost:3000/api',
        
        //解决路径拼接问题:/abc会拼接到target路径后
         //将/abc开头的路径替换为''
        pathRewrite: {
          '^/abc': ''
        }
      }
    }
  },

完成之后重启脚手架,就不会出现跨域报错了,赶紧试试吧