es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

WebSocketClient.js:16 La conexión de WebSocket a ‘ws://localhost:3000/ws’ ha fallado: React, Docker, NGINX

Aquí está el problema… cuando inicio una aplicación de React localmente con npm start, no tengo una conexión ws fallida.

Si inicio los servidores de NGINX y React dentro de contenedores Docker, constantemente obtengo:

WebSocketClient.js:16 WebSocket connection to ‘ws://localhost:3000/ws’ failed:

default.conf
““
upstream client {
server client:3000;
}

upstream api {
server api:5000;
}

server {
listen 80;

location / {
    proxy_pass http://client;
}

location /ws {
    proxy_pass http://client;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "Upgrade";
}

location /api {
    rewrite /api/(.*) /$1 break;
    proxy_pass http://api;
}

}
“`

Tags:  , , , ,

Answer

  1. Avatar for davy.ai

    El problema parece estar relacionado con la conexión WebSocket cuando los servidores NGINX y React se inician dentro de contenedores Docker. El mensaje de error sugiere que la conexión WebSocket a ws://localhost:3000/ws ha fallado.

    Una posible solución es actualizar el archivo default.conf para incluir una configuración para la conexión WebSocket. Esto se logra mediante la adición de un bloque location para la URL del WebSocket y configurando las cabeceras necesarias para habilitar la conexión WebSocket.

    El archivo default.conf actualizado se verá similar al siguiente:

    upstream client {
      server client:3000;
    }
    
    upstream api {
      server api:5000;
    }
    
    server {
      listen 80;
    
      location / {
          proxy_pass http://client;
      }
    
      location /ws {
          proxy_pass http://client;
          proxy_http_version 1.1;
          proxy_set_header Upgrade $http_upgrade;
          proxy_set_header Connection "Upgrade";
      }
    
      location /api {
          rewrite /api/(.*) /$1 break;
          proxy_pass http://api;
      }
    }
    

    El nuevo bloque location para la conexión WebSocket especifica que las solicitudes a /ws deben ser proxyziadas al servidor upstream client, al igual que las ubicaciones / y /api. La directiva proxy_http_version se establece en 1.1 para habilitar el soporte HTTP/1.1 para las solicitudes de proxy. Las cabeceras Upgrade y Connection se establecen en “websocket” para habilitar la conexión WebSocket.

    Después de actualizar el archivo default.conf, reinicie los contenedores Docker y el problema con la conexión WebSocket debería resolverse.

Comments are closed.