Можно ли передавать Authorization header при WebSocket-подключении из браузера?

Ограничение браузерного WebSocket API

При создании WebSocket-соединения из браузера с помощью конструктора new WebSocket(url) невозможно передать кастомные HTTP-заголовки, такие как Authorization. Это ограничение заложено в спецификации WebSocket API для браузеров — второй аргумент конструктора принимает только протоколы (subprotocols), а не заголовки. Серверная часть при этом может ожидать авторизацию, что создаёт проблему.

Почему так сделано

Браузеры контролируют заголовки, чтобы предотвратить утечку чувствительных данных и атаки типа CSWSH (Cross-Site WebSocket Hijacking). Разработчики намеренно ограничили возможность устанавливать произвольные заголовки, чтобы злоумышленники не могли подделать запросы через скрипты.

Как обойти ограничение

Существует несколько распространённых подходов:

• Передача токена через query string: добавить параметр в URL, например wss://example.com/socket?token=abc123. Сервер должен извлечь токен из строки запроса при handshake.
• Авторизация после открытия соединения: отправить первое сообщение с токеном, а сервер — проверить его и закрыть соединение при неверном токене.
• Использование cookies: если сервер поддерживает cookies, можно положить токен в cookie, и браузер отправит его автоматически (но это менее безопасно).

Пример кода

// Передача токена через query string
const token = 'my-secret-token';
const socket = new WebSocket(`wss://example.com/ws?token=${token}`);

socket.onopen = () => {
  console.log('Connected');
};

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

На сервере (например, Node.js с библиотекой ws) нужно извлечь параметр из URL:

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

wss.on('connection', (ws, req) => {
  const params = new URL(req.url, 'http://localhost').searchParams;
  const token = params.get('token');
  if (token !== 'my-secret-token') {
    ws.close(1008, 'Unauthorized');
    return;
  }
  console.log('Authenticated client');
});

Вывод

Передача Authorization header напрямую через браузерный WebSocket невозможна, поэтому используйте query string или первое сообщение для аутентификации. Этот подход безопасен при правильной валидации на сервере и подходит для большинства real-time приложений, таких как чаты или уведомления.