WebSockets

Definição

WebSockets são uma tecnologia que permite comunicação bidirecional em tempo real entre cliente (como navegadores) e servidor, usando uma única conexão persistente baseada em TCP.

Diferente do modelo tradicional baseado em HTTP — onde o cliente precisa fazer uma nova requisição para cada interação — os WebSockets permitem que servidores também iniciem o envio de dados a qualquer momento, sem necessidade de uma requisição prévia.

Essa abordagem é ideal para aplicações interativas que exigem atualização contínua e imediata de informações.

Objetivos dos WebSockets

Habilitar comunicação em tempo real: ideal para chats, jogos, notificações e dados ao vivo.
Eliminar o overhead do HTTP tradicional: uma vez estabelecida, a conexão é reutilizada.
Permitir envio de dados do servidor para o cliente (push).
Reduzir a latência da comunicação: menos troca de cabeçalhos e reabertura de conexões.

Exemplo prático — Comunicação WebSocket com cliente JS e servidor Node.js

Servidor WebSocket (Node.js + ws)

// servidor.js
const WebSocket = require("ws");

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

servidor.on("connection", (socket) => {
  console.log("Cliente conectado");

  socket.on("message", (mensagem) => {
    console.log("Mensagem recebida:", mensagem.toString());
    socket.send(`Eco: ${mensagem}`);
  });

  socket.on("close", () => {
    console.log("Conexão encerrada");
  });
});

Execute com:

node servidor.js

Cliente WebSocket (HTML + JavaScript)

<!-- index.html -->
<script>
  const socket = new WebSocket("ws://localhost:8080");

  socket.onopen = () => {
    console.log("Conexão aberta");
    socket.send("Olá, servidor!");
  };

  socket.onmessage = (event) => {
    console.log("Resposta do servidor:", event.data);
  };

  socket.onerror = (error) => {
    console.error("Erro:", error);
  };
</script>

Para testar, abra o arquivo index.html em um navegador enquanto o servidor Node.js estiver rodando. A mensagem será exibida no console do navegador junto com a resposta enviada pelo servidor.

O ciclo do WebSocket

[Cliente inicia conexão via HTTP]
        ↓
[Envia cabeçalho solicitando upgrade para protocolo WebSocket]
        ↓
[Servidor aceita → conexão é promovida para ws:// ou wss://]
        ↓
[Canal persistente de comunicação é mantido]
        ↓
[Ambos (cliente e servidor) podem trocar mensagens a qualquer momento]

ws:// - conexão WebSocket sem criptografia

wss:// - conexão WebSocket com segurança (TLS), equivalente ao HTTPS

Essa estrutura reduz significativamente o tempo e o volume de dados transferidos em aplicações interativas.