react启动报错: ‘onBeforeSetupMiddleware’option is deprecated.Please use the ‘setupMiddlewares‘ option.
1.出现场景
在学习react配置代理的第一种方式,在package.json中追加proxy配置成功后,进行了多个代理配置的方式进行代理配置,结果页面访问不了
并且npm start途中,截图到一段错误
2.出现的原因
出现的原因应该是我的React版本高了(18.2.0),setupProxy.js的写法不一样了
3.解决方法
//旧版本写法
// const proxy = require('http-proxy-middleware')
// module.exports = function(app){
// app.use(
// proxy('/api1',{ //遇见/api1前缀的请求,就会触发该代理配置
// target:'http://localhost:5000', //请求转发给谁
// changeOrigin:true,//控制服务器收到的请求头中Host的值
// pathRewrite:{'^/api1':''} //重写请求路径(必须)
// }),
// proxy('/api2',{
// target:'http://localhost:5001',
// changeOrigin:true,
// pathRewrite:{'^/api2':''}
// }),
// )
// }
//react 18版本写法
const {createProxyMiddleware} = require('http-proxy-middleware')
module.exports = function (app) {
app.use(
//跨域1
createProxyMiddleware('/api1', { // 当发起以 /api1 为前缀的请求时,触发该代理
target: 'http://localhost:5000', /* 要转发的地址 */
//为true时,Host为 服务端ip和端口,false为请求方ip和端口
//服务器接收的 Host 字段的值。(是否欺骗服务器请求来源。默认false)
changeOrigin: true,
// 将 /api1 前缀置为空
pathRewrite: {'^/api1': ''}
}),
createProxyMiddleware('/api2', { // 当发起以 /api1 为前缀的请求时,触发该代理
target: 'http://localhost:5001', /* 要转发的地址 */
//为true时,Host为 服务端ip和端口,false为请求方ip和端口
//服务器接收的 Host 字段的值。(是否欺骗服务器请求来源。默认false)
changeOrigin: true,
// 将 /api1 前缀置为空
pathRewrite: {'^/api2': ''}
}),
//跨域2
)
}
记录下
这篇好文章是转载于:学新通技术网
- 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
- 本站站名: 学新通技术网
- 本文地址: /boutique/detail/tanhgafakf
系列文章
更多
同类精品
更多
-
photoshop保存的图片太大微信发不了怎么办
PHP中文网 06-15 -
Android 11 保存文件到外部存储,并分享文件
Luke 10-12 -
word里面弄一个表格后上面的标题会跑到下面怎么办
PHP中文网 06-20 -
《学习通》视频自动暂停处理方法
HelloWorld317 07-05 -
photoshop扩展功能面板显示灰色怎么办
PHP中文网 06-14 -
微信公众号没有声音提示怎么办
PHP中文网 03-31 -
excel下划线不显示怎么办
PHP中文网 06-23 -
怎样阻止微信小程序自动打开
PHP中文网 06-13 -
excel打印预览压线压字怎么办
PHP中文网 06-22 -
TikTok加速器哪个好免费的TK加速器推荐
TK小达人 10-01