Как зашифровать соединение на WebSocket?

Защищённый WebSocket (WSS)

Для зашифрования соединения WebSocket используется протокол WSS (WebSocket Secure), который основан на TLS/SSL шифровании. Это аналог HTTPS для WebSocket.

Различие между WS и WSS

WS отправляет данные в открытом виде, любой может перехватить. WSS использует TLS для шифрования всех данных.

Использование WSS на клиенте

// Обычный WebSocket (НЕБЕЗОПАСНО)
const ws = new WebSocket('ws://example.com');

// Защищённый WebSocket (ПРАВИЛЬНО)
const wss = new WebSocket('wss://example.com');

// Обработка событий
wss.onopen = () => {
  console.log('Connected securely');
  wss.send('Hello, server!');
};

wss.onmessage = (event) => {
  console.log('Received:', event.data);
};

wss.onerror = (error) => {
  console.error('Connection error:', error);
};

wss.onclose = () => {
  console.log('Disconnected');
};

Конфигурация на Node.js/Express сервере

const https = require('https');
const WebSocketServer = require('ws').Server;
const fs = require('fs');

// Загружаем SSL сертификат
const options = {
  cert: fs.readFileSync('/path/to/cert.pem'),
  key: fs.readFileSync('/path/to/key.pem')
};

// Создаём HTTPS сервер
const server = https.createServer(options);

// Привязываем WebSocket Server к HTTPS
const wss = new WebSocketServer({ server });

wss.on('connection', (ws) => {
  console.log('Client connected securely');
  
  ws.on('message', (data) => {
    console.log('Received:', data);
    ws.send('Echo: ' + data);
  });
  
  ws.on('close', () => {
    console.log('Client disconnected');
  });
});

server.listen(443);

Конфигурация на Python/FastAPI

from fastapi import FastAPI, WebSocket
from fastapi.websockets import WebSocketDisconnect
import ssl
import uvicorn

app = FastAPI()

@app.websocket("/ws")
async def websocket_endpoint(websocket: WebSocket):
    await websocket.accept()
    try:
        while True:
            data = await websocket.receive_text()
            await websocket.send_text(f"Echo: {data}")
    except WebSocketDisconnect:
        print("Client disconnected")

# Запуск с SSL
if __name__ == "__main__":
    ssl_context = ssl.SSLContext(ssl.PROTOCOL_TLS_SERVER)
    ssl_context.load_cert_chain(
        certfile="/path/to/cert.pem",
        keyfile="/path/to/key.pem"
    )
    
    uvicorn.run(
        app,
        host="0.0.0.0",
        port=443,
        ssl_context=ssl_context
    )

Конфигурация с nginx reverse proxy

server {
    listen 443 ssl;
    server_name example.com;
    
    ssl_certificate /path/to/cert.pem;
    ssl_certificate_key /path/to/key.pem;
    
    location / {
        proxy_pass http://localhost:8000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header Host $host;
    }
}

Проверка WSS в браузере

// Проверка протокола
const wss = new WebSocket('wss://example.com');

// В DevTools -> Network -> WS
// Должно быть:
// Protocol: websocket
// Scheme: wss://

Получение SSL сертификата (Let's Encrypt)

# Установка certbot
sudo apt install certbot

# Генерация сертификата для домена
sudo certbot certonly --standalone -d example.com

# Сертификаты будут в:
# /etc/letsencrypt/live/example.com/fullchain.pem
# /etc/letsencrypt/live/example.com/privkey.pem

Важные моменты безопасности

1. ВСЕГДА используй WSS в production — WS отправляет все данные открыто
2. Используй валидные сертификаты — самоподписанные вызывают ошибки в браузере
3. HTTPS для REST API — если используешь WebSocket, и REST должны быть защищены
4. Валидация данных — даже с WSS нужна валидация на сервере
5. Аутентификация — передавай токены при подключении

Передача токена при подключении WSS

const token = localStorage.getItem('token');
const wss = new WebSocket(`wss://example.com?token=${token}`);

WSS — стандартная и необходимая практика для любого WebSocket приложения с чувствительными данными.