本地项目跨域解决方案(前端)

浏览器解决跨域

  • 本地项目跨域
    • whistle安装过程
    • 配置

本地项目跨域

刚进入一家公司在本地建立好项目,打开首页遇到页面接口跨域的问题,导致项目运行不起来。这里整理一份能解决跨域问题,只限于本地开发项目使用。

whistle安装过程

http://wproxy.org/whistle/install.html

按照上面网址进行whistle

  1. 全局安装 npm install -g whistle ;
  2. 启动命令 w2 restart ;
  3. 停止 w2 stop;

配置

安装好后,进入SwitchyOmega 页面 ->proxy
配置条件设置
1、 代理服务器 127.0.0.1
2、 代理端口 8899
3、不代理地址列表 只写 ::1
代理服务器如下图:
本地项目跨域解决方案(前端)_第1张图片
4、进入地址 127.0.0.1:8899
如下图
本地项目跨域解决方案(前端)_第2张图片
5、点击http 会出现一个二维码弹窗 二维码下面选择第一个选项,点击二维码上方Download RootCA 如下图本地项目跨域解决方案(前端)_第3张图片

本地项目跨域解决方案(前端)_第4张图片

本地项目跨域解决方案(前端)_第5张图片
6、 按照上方图片步骤完成后,打开浏览器有上方三个点找到,更多工具->扩展程序
如下图:
本地项目跨域解决方案(前端)_第6张图片
本地项目跨域解决方案(前端)_第7张图片
如果现实到这里,代理已经完成 正常访问选择直接连接,如果需要本地跨域选择proxy代理 代理后有可能会访问不了正常地址!

你可能感兴趣的:(前端跨域,html5,javascript,es6,vue.js,npm)