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的更多相关文章

  1. react 设置代理(proxy) 实现跨域请求

    一,对于使用creat-react-app构建的项目,可以直接在package.json下配置,具体如下 "proxy": "http://api.xxxx.com&qu ...

  2. C#中给WebClient添加代理Proxy

    效果图: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; ...

  3. 代理(Proxy)和反射(Reflection)

    前面的话 ES5和ES6致力于为开发者提供JS已有却不可调用的功能.例如在ES5出现以前,JS环境中的对象包含许多不可枚举和不可写的属性,但开发者不能定义自己的不可枚举或不可写属性,于是ES5引入了O ...

  4. 深度揭秘ES6代理Proxy

    最近在博客上看到关于ES6代理的文章都是一些关于如何使用Proxy的例子,很少有说明Proxy原理的文章,要知道只有真正掌握了一项技术的原理,才能够写出精妙绝伦的代码,所以我觉得有必要写一篇关于深刻揭 ...

  5. Webpack代理proxy配置,解决本地跨域调试问题,同时允许绑定host域名调试

    Webpack代理proxy配置,解决本地跨域调试问题,同时允许绑定host域名调试 会撸码的小马 关注 2018.05.29 17:30* 字数 212 阅读 1488评论 0喜欢 2 接到上一章, ...

  6. JAVA设计模式-动态代理(Proxy)源码分析

    在文章:JAVA设计模式-动态代理(Proxy)示例及说明中,为动态代理设计模式举了一个小小的例子,那么这篇文章就来分析一下源码的实现. 一,Proxy.newProxyInstance方法 @Cal ...

  7. 解决跨域、同源策略-React中代理的配置

    React中代理的配置 主要是解决同源策略的问题 何为同源策略? 因为我们React在3000端口,Vue在8080端口,而后台接口往往在5000,这种不同的端口之间就是一种跨域的问题了 axios发 ...

  8. React Native & Google & Proxy

    React Native & Google & Proxy https://snack.expo.io/ https://expo.io/snacks/@xgqfrms https:/ ...

  9. 浅谈Java代理一:JDK动态代理-Proxy.newProxyInstance

    浅谈Java代理一:JDK动态代理-Proxy.newProxyInstance java.lang.reflect.Proxy:该类用于动态生成代理类,只需传入目标接口.目标接口的类加载器以及Inv ...

随机推荐

  1. 单调队列优化&&P1886 滑动窗口题解

    单调队列: 顾名思义,就是队列中元素是单调的(单增或者单减). 在某些问题中能够优化复杂度. 在dp问题中,有一个专题动态规划的单调队列优化,以后会更新(现在还是太菜了不会). 在你看到类似于滑动定长 ...

  2. Java 包装类及其与String转换、进制转换

    一.包装类 1.基本类型和引用类型 Java中的基本类型我们都知道有8种,但是作为基本类型限制功能的发挥,例如整形转String类型等可能需要类方法实现会更加简便.那么八个基本类型对应八个包装类,即引 ...

  3. js高阶函数汇总

    map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值,函数按照原始数组元素顺序依次处理元素. 注意: map() 不会对空数组进行检测. 注意: map() 不会改变原始数组. ...

  4. (web)个人项目(挖宝网)

    前台:使用bootstrap. 后台:使用layui. 数据库:mysql 下载地址:https://github.com/oukele/wabaowangDemo(数据库文件忘记上传,我在展示功能结 ...

  5. hive日期函数-Demo(二)

    需求:某资产近一个月的资产值 比如:今天是2018年2月28日,近一个月若是按照自然月来算,那么是2018年2月1日至2018年2月28日.最终需要的日期格式为:yyyyMMdd. 当日时间戳 uni ...

  6. python爬虫添加请求头

    request import requests headers = { # 'Accept': 'application/json, text/javascript, */*; q=0.01', # ...

  7. 2g 大文件上传

    核心原理: 该项目核心就是文件分块上传.前后端要高度配合,需要双方约定好一些数据,才能完成大文件分块,我们在项目中要重点解决的以下问题. * 如何分片: * 如何合成一个文件: * 中断了从哪个分片开 ...

  8. javaScript第二篇

    事件处理函数 javaScript响应用户操作等都是通过事件处理来触发;其基本形式为 event = "javaScript statement(s);" 事件 = "事 ...

  9. 51Nod 1055 最长等差数列 (dp+哈希)

    1055 最长等差数列  基准时间限制:2 秒 空间限制:262144 KB 分值: 80 难度:5级算法题  收藏  关注 N个不同的正整数,找出由这些数组成的最长的等差数列. 例如:1 3 5 6 ...

  10. 线段树初步——转载自ljc20020730

    线段树初步   线段树模板1:https://www.luogu.org/problem/show?pid=3372 线段树模板2:https://www.luogu.org/problem/show ...