Implementación de WebSockets en Node.js

En el ámbito del desarrollo web, la comunicación en tiempo real se ha convertido en una necesidad clave. WebSockets ofrece una solución adecuada, permitiendo una comunicación bidireccional entre el cliente y el servidor. En este artículo, exploraremos cómo implementar WebSockets en aplicaciones Node.js, utilizando la popular biblioteca ws.

¿Qué son los WebSockets?

WebSockets son un protocolo que permite la comunicación interactiva entre un navegador y un servidor. A diferencia de HTTP, WebSockets mantienen un canal abierto, lo que permite el envío de mensajes en tiempo real.

Ventajas de WebSockets

  • Comunicación bidireccional: Permite que tanto el cliente como el servidor envíen mensajes.
  • Bajo overhead: Una vez que se establece la conexión, el tamaño del encabezado es reducido, lo que mejora el rendimiento.
  • Soporte en muchos navegadores: La mayoría de los navegadores modernos soportan el protocolo WebSocket.

Configuración del Entorno

Para comenzar, asegúrate de tener Node.js instalado en tu sistema. Luego, crea un nuevo proyecto e instala la biblioteca ws:

mkdir ws-example
cd ws-example
npm init -y
npm install ws

Creando un Servidor WebSocket

A continuación, crearemos un servidor que escuche conexiones WebSocket:

const WebSocket = require('ws');

const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', (ws) => {
    console.log('Cliente conectado');

    ws.on('message', (message) => {
        console.log(`Mensaje recibido: ${message}`);
        ws.send(`Eco: ${message}`);
    });
});

console.log('Servidor WebSocket escuchando en ws://localhost:8080');

Cliente WebSocket

Ahora necesitamos un cliente para probar nuestra implementación. Crea un archivo index.html con el siguiente código:

<!DOCTYPE html>
<html>
<head>
    <title>Cliente WebSocket</title>
</head>
<body>
    <input id="message" type="text" placeholder="Escribe un mensaje">
    <button id="send">Enviar</button>
    <div id="messages"></div>
    <script>
        const ws = new WebSocket('ws://localhost:8080');

        ws.onmessage = (event) => {
            const messagesDiv = document.getElementById('messages');
            messagesDiv.innerHTML += '<p>' + event.data + '</p>';
        };

        document.getElementById('send').onclick = () => {
            const message = document.getElementById('message').value;
            ws.send(message);
            document.getElementById('message').value = '';
        };
    </script>
</body>
</html>

Prueba tu Aplicación

Inicia el servidor ejecutando node server.js y abre index.html en varios navegadores. Al enviar mensajes, deberías ver las respuestas en tiempo real.

Conclusión

WebSockets es una herramienta poderosa para implementar comunicación en tiempo real en tus aplicaciones. Este tutorial cubrió los aspectos básicos de la implementación en Node.js usando la biblioteca ws. Puedes expandir esta funcionalidad para crear aplicaciones de chat, juegos en línea, y más.