Как настроить cook ie через разные порты с помощью веб-сокета (express -session / React dev server)?

Question

Я пытаюсь работать с express -сессией вместе с приложением React, работающим на другом порту с dev-сервером. Я также использую Socket.io с промежуточным программным обеспечением express-socket.io-session. Все работает нормально, когда я создаю свое приложение React и обслуживаю файлы с express обычно с того же порта.

Код на стороне сервера выглядит следующим образом (работает на порте 4000):

var app = require("express")();
var server = require('http').Server(app);
var io = require('socket.io')(server);
let expressSession = require('express-session');
let sharedsession = require("express-socket.io-session");
var path = require('path');

var host = process.env.HOST || '0.0.0.0';
var port = process.env.PORT || 4000;

server.listen(port, host, function () {
    console.log("Server running on: " + host + " : " + port);
});

let session = expressSession({
    secret: 'my-secret',
    resave: true,
    saveUninitialized: true,
    cookie: {
        maxAge: 10000,
        httpOnly: true,
        sameSite: true,
        secure: false,
    },
})

app.use(session);

if (process.env.NODE_ENV === 'production') {
    app.use(require('express').static('client/build'));

    app.get('/*', (req, res) => {
        res.sendFile(path.join(__dirname, 'client', 'build', 'index.html'));
    });
}

io.use(sharedsession(session, {
    autoSave: true
}));


io.on('connection', function (socket) {
    console.log(`socket with id ${socket.id} connection established`);
    socket.handshake.session.userdata = Math.random();
    socket.handshake.session.save();
});

На React-клиенте (работает на порту 3000):

import React, { useEffect } from 'react';
import './App.css';
import io from 'socket.io-client';
import SocketContext from './services/SocketProvider';



function App() {
  var serverIP = "http://localhost:3000";
  if(process.env.NODE_ENV === 'development'){
    serverIP = "http://localhost:3000";
  }
  let socket = io(serverIP, { autoConnect: false });

  useEffect(() => {
    //...
    socket.open();
  }, []);

  return (
    <div className="App">
     <SocketContext.Provider value={socket}>
      {/*...*/}
  </SocketContext.Provider>
    </div>
  );
}

export default App;

Я пытался прокси-запросы в моем клиенте package.json с "proxy": "http://localhost:4000",, но затем я получаю ошибку: Proxy error: Could not proxy request /socket.io/?EIO=3&transport=polling&t=N2h8JjB&sid=0pLm05526v6P2SZCAAAA from localhost:3000 to http://localhost:4000.

Итак, я попытался настроить ручной прокси-сервер в файле setupProxy.js и удалил оператор proxy в package.json:

const proxy = require('http-proxy-middleware');

module.exports = function(app) {
  app.use(proxy.createProxyMiddleware('/', { target: 'ws://localhost:4000', ws: true }));
};

И, наконец, это позволяет настроить клиентский повар ie через соединение socket.io. Но все остальное больше не будет работать. Например, мой сайт будет показывать: Cannot GET /

Если я использую app.use(proxy.createProxyMiddleware('/socket.io', { target: 'ws://localhost:4000', ws: true }));, мое приложение снова покажет все, а также мое соединение Socket.io работает, но не готовится повар ie.

Кто-нибудь знает, как правильно все прокси или у него есть другой подход? Я потратил несколько дней на это - любая помощь высоко ценится.