- 安装
Notes:
该中间件只在开发时候会用到,所以安装到devDependencies,不会打包到项目中;
项目上线应该到nginx服务器上配置
//该中间件只在开发时会用到,所以安装到devDependencies,不会打包到项目中;
//项目上线应该到nginx服务器中配置转发代理
npm install --save-dev http-proxy-middleware
- 使用
在src文件夹下创建setupProxy.js,在node_modules中react-scripts包中,有一个webpack.config.js文件。
其中有这样一串代码,可以确定配置文件的名称与位置
‘!**/src/setupProxy.*’
const {createProxyMiddleware} = require('http-proxy-middleware');
module.exports = function(app) {
app.use(createProxyMiddleware('/portal', {
target: 'http: 106.75.95.89:90008'
}));
}
app.use可以配置多个域;
遇到的问题与疑惑
在http-proxy-middleware官网与gitHub中的写法如下:
const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');
const app = express();
app.use('/api',
createProxyMiddleware(
{
target: 'http://www.example.org',
changeOrigin: true
})
);
app.listen(3000);
没有像以上的用法,app是通过moudle暴露出来的,而是通过express生成的,我按照官方的写法,报错了;
报的require(...) is not a function
我在网上也没有搜到类似的问题;我看了node_modules 中http-proxy-middleware 包中的pakage.json文件中
看到这个包已经引入过express了; 目前分不清官网写法与module.exports写法有什么不一样,如果有哪位大神知道是什么原理的,
一定带带我这个菜鸡,目前react还在摸索中,感谢!!!