My React app is not registering setupProxy.js with http-proxy-middleware

Question

I am trying to proxy to multiple API with setupProxy.js but its totally not working. Only way i can proxy request in dev now is setting proxy string in package.json but its not solving my problem since i need to proxy to multiple endpoints and with string i can use only one.

I am using "http-proxy-middleware": "^0.19.1"

My setupProxy.js looks like this:

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!');
    });
  }

I have tried different modifications. Without module.exports, with app parameter in function(app) and without express and app variables but nothing works.

Answer 1

You must import the createProxyMiddleware from http-proxy-middleware correctly:

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

Try using the first arg passed to the anonymous function as app

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