前端代理----whistle

场景一:如何将本地的请求代理到服务器上(如果接口没有校验登陆的情况)

最简单的方法:在项目文件中找到webpack开发环境的配置文件,配置devServer对象

devServer: {
contentBase: './dist',
port: 8081,
hot: true,
open: true,
historyApiFallback: true,
host: '127.0.0.1',
disableHostCheck: true,
headers: {
'Access-Control-Allow-Origin': '*'
},
proxy: {
'/api/*': {
target: 'http://10.52.183.114:8000/fdi-fe',
changeOrigin: true,
secure: false
}
}
}

(注:主要配置target后面的路径,上面例子的/api下面的文件路径都代理到target地址,具体的其他配置以实际项目的需求为主)

场景二: 如何将服务器上的代码代理到本地环境(便于本地调试)(运用工具Whistle)

第一步: 安装并启动Whistle(确保已经安装了node, 如果没有的话,得先安装node)

安装-----------npm install -g whistle

启动-----------w2 start

访问whistle------127.0.0.1:8899

第二步:配置代理服务器

方法一:直接配置系统代理

前端代理----whistle

方法二,浏览器代理,安装chrome插件----Proxy SwitchyOmega(可以进行代理的切换)

安装完Proxy SwitchyOmega之后,进入页面,在情景模式下面点击新建情景模式,然后进行如下配置(标红部分)

前端代理----whistle

第三步,配置Whistle

网址中输入127.0.0.1:8899,进入Whistle页面

前端代理----whistle

以上就完成了所有的配置,当你访问http://10.95.109.152:8093的时候,访问就是本地的127.0.0.1:8081的代码,接下来就可以愉快的在本地进行调试啦!

上一篇:java_类泛型承继方法


下一篇:sqoop:【error】从hdfs导入到mysql 报ERROR tool.ExportTool: Error during export: Export job failed!