react 中使用http-proxy-middleware
时间: 2024-06-13 22:09:34 浏览: 14
在React中使用http-proxy-middleware可以将请求转发给其他服务器,以下是使用http-proxy-middleware的步骤:
1.安装http-proxy-middleware
```
npm install --save-dev http-proxy-middleware
```
2.在src同级目录创建setupProxy.js文件,代码如下:
```javascript
const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function (app) {
app.use(createProxyMiddleware('/api', {
target: 'http://ip:8000/', // 将请求转发到的服务器地址
pathRewrite: {
'^/api': '', // 将请求中的/api替换为空
},
changeOrigin: true, // 是否跨域
secure: false, // 是否验证证书
ws: true, // 启用websocket
}));
};
```
3.在React组件中使用转发后的请求,例如:
```javascript
fetch('/api/data')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));
```