Блог

У меня есть приложение React, которое настраивается setupProxy.js, и предполагается, что он будет прокси-сервером моего бэкенда ws. Но почему-то соединение не установлено, однако запросы http и https работают просто отлично. пример прикрепления кода:
setupProxy.js

 const { createProxyMiddleware } = require('http-proxy-middleware')

module.exports = (app) => {
    app.use(
        '/sockets',
        createProxyMiddleware({
            target: 'ws://localhost:8080',
            pathRewrite: (path) => path.replace('/sockets', ''),
            secure: false,
            changeOrigin: true
        })
    );

    app.use(
        '/hello', 
        createProxyMiddleware({
            target: 'http://localhost:8080/hello',
            pathRewrite: (path) => path.replace('/hello', ''),
            secure: false,
            changeOrigin: true
        })
    )
}
 

Приложение.tsx

 import React from 'react';

const App: React.FC = () => {

  React.useEffect(() => {
    new WebSocket(`ws://${window.location.host}/sockets`);
    fetch('/hello').then(value => value.json()).then(res => console.log('response: ', res))
  }, [])

  return (
    <div>
      Hello World
    </div>
  )
}

export default App;
 

backend/index.js

 const express = require('express');
const app = express();
const http = require('http');
const server = http.createServer(app);
const { Server } = require("socket.io");
const io = new Server(server);

app.get('/hello', (req, res) => res.send({hello: 'hello'}))

io.on('connection', (socket) => {
    console.log('a user connected');
    socket.disconnect();
});

server.listen(8080, () => {
    console.log('listening on *:8080');
});
 

Заранее спасибо 😉