react 添加代理 proxy
react package.json中proxy的配置如下
"proxy": {
"/api/rjwl": {
"target": "http://47.94.142.215:8081",
"changeOrigin": true
}
}
报错:
When specified, "proxy" in package.json must be a string.
Instead, the type of "proxy" was "object".
Either remove "proxy" from package.json, or make it a string.
原因 React 的 package.json 不支持proxy是对象,只支持字符串
// 这样可以使用
"proxy": "http://wxlive.gaing.cn",
解决办法
安装 http-proxy-middleware
yarn add http-proxy-middleware
在创建一个setupProxy.js文件,在src目录,src/setupProxy.js
const proxy = require('http-proxy-middleware')
module.exports = function (app) {
app.use(proxy('/api', {
target: 'http://www.test.com',
secure: false,
changeOrigin: true,
pathRewrite: {
"^/api": "/api"
}
}))
}
完成,运行
yarn start
作者:taoqun
地址:http://taoquns.com/paper/48
react 添加代理 proxy的更多相关文章
- react 设置代理(proxy) 实现跨域请求
一,对于使用creat-react-app构建的项目,可以直接在package.json下配置,具体如下 "proxy": "http://api.xxxx.com&qu ...
- C#中给WebClient添加代理Proxy
效果图: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; ...
- 代理(Proxy)和反射(Reflection)
前面的话 ES5和ES6致力于为开发者提供JS已有却不可调用的功能.例如在ES5出现以前,JS环境中的对象包含许多不可枚举和不可写的属性,但开发者不能定义自己的不可枚举或不可写属性,于是ES5引入了O ...
- 深度揭秘ES6代理Proxy
最近在博客上看到关于ES6代理的文章都是一些关于如何使用Proxy的例子,很少有说明Proxy原理的文章,要知道只有真正掌握了一项技术的原理,才能够写出精妙绝伦的代码,所以我觉得有必要写一篇关于深刻揭 ...
- Webpack代理proxy配置,解决本地跨域调试问题,同时允许绑定host域名调试
Webpack代理proxy配置,解决本地跨域调试问题,同时允许绑定host域名调试 会撸码的小马 关注 2018.05.29 17:30* 字数 212 阅读 1488评论 0喜欢 2 接到上一章, ...
- JAVA设计模式-动态代理(Proxy)源码分析
在文章:JAVA设计模式-动态代理(Proxy)示例及说明中,为动态代理设计模式举了一个小小的例子,那么这篇文章就来分析一下源码的实现. 一,Proxy.newProxyInstance方法 @Cal ...
- 解决跨域、同源策略-React中代理的配置
React中代理的配置 主要是解决同源策略的问题 何为同源策略? 因为我们React在3000端口,Vue在8080端口,而后台接口往往在5000,这种不同的端口之间就是一种跨域的问题了 axios发 ...
- React Native & Google & Proxy
React Native & Google & Proxy https://snack.expo.io/ https://expo.io/snacks/@xgqfrms https:/ ...
- 浅谈Java代理一:JDK动态代理-Proxy.newProxyInstance
浅谈Java代理一:JDK动态代理-Proxy.newProxyInstance java.lang.reflect.Proxy:该类用于动态生成代理类,只需传入目标接口.目标接口的类加载器以及Inv ...
随机推荐
- binlog2sql快速闪回
https://github.com/danfengcao/binlog2sql 一.说明: DML(data manipulation language): 它们是SELECT.UPDA ...
- nginx之"/"结尾
一.配置127.0.0.1:8081的tomcat下的文件: 1.ROOT/a.html : this is ROOT page 2.ROOT/testa.html : nihao 3.ROOT/in ...
- FastDFS为什么要结合Nginx?
为什么选择Nginx Nginx 是一个很牛的高性能Web和反向代理服务器, 它具有有很多非常优越的特性: 在高连接并发的情况下,Nginx是Apache服务器不错的替代品: Nginx在美国是做虚拟 ...
- [Algorithm] Finding all factors of a number
12's factors are: {1,2,3,4,6,12} function factors (n) { let list = []; for (let i = 1; i < Math.s ...
- 题解 【ZJOI2009】 假期的宿舍
题面 解析 这其实就是个二分图匹配的水题(虽然我还是爆零了) 这题的意思就是说,有x个人,y张床(x,y不确定), 每个人只能睡在指定的几张床上, 问能否使每人都有床睡. 所以,直接二分图匹配,看最大 ...
- 23.Python位运算符详解
位运算符通常在图形.图像处理和创建设备驱动等底层开发中使用.使用位运算符可以直接操作数值的原始 bit 位,尤其是在使用自定义的协议进行通信时,使用位运算符对原始数据进行编码和解码也非常有效. 位运算 ...
- LVS集群之NAT模式
集群的分类: (1)HA:高可用集群,有叫双机热备 原理:两台机器A.B,正常是A提供服务,当A机宕机或者服务有问题时,会切换到B机继续提供服务常用的高了永软件:heartbeat和keepalive ...
- Hive运行原理--JOIN
对于 JOIN 操作: INSERT OVERWRITE TABLE pv_users SELECT pv.pageid, u.age FROM page_view pv JOIN user u ON ...
- FRP
使用 FRP 反向代理实现 Windows 远程连接 互联网普及率的日渐攀升与 IPv4 资源的持续减少,现在大部分家庭宽带都不会分配公网 IP ,这使一些网络应用的实现多了些困难,像个人的 NAS ...
- ASIHTTPRequest使用
http://qk13warcraft.blog.163.com/blog/static/157549344201271633014969/ 1.创建和运行请求 创建一个同步请求 这是最简单的用法,发 ...