我的 React 應用程序沒有使用 http-proxy-middleware 注冊 setupProxy.js

Question

我正在嘗試使用 setupProxy.js 代理多個 API，但它完全不起作用。 我現在可以在 dev 中代理請求的唯一方法是在 package.json 中設置proxy字符串，但它不能解決我的問題，因為我需要代理到多個端點並且字符串我只能使用一個。

我正在使用"http-proxy-middleware": "^0.19.1"

我的 setupProxy.js 看起來像這樣：

var express = require('express');
var app = express();
var proxy = require('http-proxy-middleware');
var cors = require('cors')

module.exports = function() {
    app.use(cors());

    app.use(proxy('/api', { target: 'http://localhost:52992/' }));
    app.use(proxy('/otherapi', { target: 'https://localhost:44309/' }));
  
    app.get('/einreichung', function(req, res){
        res.sendfile(__dirname + '/build/index.html');
    });
    
    app.use(express.static(__dirname + '/build'));
    
    
    app.listen(3000, function () {
        console.log('Example app listening on port 3000!');
    });
  }

我嘗試了不同的修改。 沒有 module.exports，在function(app)有 app 參數，沒有express和 app variables但沒有任何效果。

Answer 1

您必須正確地從http-proxy-middleware導入createProxyMiddleware ：

var express = require('express');
var app = express();
var { createProxyMiddleware } = require('http-proxy-middleware');
var cors = require('cors');

https://create-react-app.dev/docs/proxying-api-requests-in-development

Answer 2

嘗試使用傳遞給匿名函數的第一個 arg 作為app

module.exports = function(app) {
    // your code...
}