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

发布时间:2022-06-30 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了如何解决开发环境中的跨域问题(二)脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

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': ''
        }
      }
    }
  },

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

脚本宝典总结

以上是脚本宝典为你收集整理的如何解决开发环境中的跨域问题(二)全部内容,希望文章能够帮你解决如何解决开发环境中的跨域问题(二)所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: