Proxy configuration to websockets server using express and http-proxy-middleware

Question

Thanks in advance for the help :)

I am trying to setup a proxy to my websocket server using express and http-proxy-middleware, a short version of my server code looks like:

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


const app = express();
app.use(spa(resolve(rootPath, 'index.html')));
app.use(express.static(rootPath));

app.use(
  '/web-base/**',
  proxy({
    target: proxyTarget, // defined using a util function 
    secure: false,
    changeOrigin: true,
    onProxyRes,
  }),
);

app.use(
  '/websocket-client',
  proxy({
    target: wss://backend-production/,
    secure: false,
    changeOrigin: true,
    ws: true,
}),
);

In my client, I am initializing the websocket connection by:

          socket.connect(
            `${process.env === PRODUCTION ? 'wss' : 'ws'}://${
              window.location.host
            }/websocket-client/`,
          );

When I am running the app locally, I connect to the WS successfully. However, in production (deployed or by serving the files from the build) I get the following error:

enter image description here

I guess I am missing something but not really sure what is it. Thanks for any help!

I was expecting the websocket to behave as in local environment and make the connection to the websocket