Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про JavaScript: websocket, sse

Как получать информацию в реальном времени?

Вопрос проверяет знание технологий для работы с данными в реальном времени, таких как WebSocket, Server-Sent Events (SSE) и Long Polling.

Короткий ответ

Для получения данных в реальном времени используют:

  • WebSocket – двустороннее соединение между клиентом и сервером.

  • Server-Sent Events (SSE) – поток односторонних сообщений от сервера.

  • Long Polling – запросы с долгим ожиданием ответа.

Длинный ответ

1. WebSocket

Протокол ws:// или wss:// (безопасный), поддерживающий двустороннюю связь.

Пример:

const socket = new WebSocket('wss://example.com/ws');

socket.onopen = () => console.log('Соединение установлено');  
socket.onmessage = (event) => console.log('Получено:', event.data);  
socket.onclose = () => console.log('Соединение закрыто');  

// Отправка данных  
socket.send('Привет, сервер!');  

Плюсы:

  • Мгновенная передача данных.

  • Поддержка бинарных данных.

Минусы:

  • Сложнее в настройке сервера.

2. Server-Sent Events (SSE)

Односторонний поток данных от сервера (например, для уведомлений).

Клиентский код:

const eventSource = new EventSource('/updates');  

eventSource.onmessage = (event) => {  
  	console.log('Новое сообщение:', event.data);  
};  

Сервер (Node.js + Express):

app.get('/updates', (req, res) => {  
  	res.setHeader('Content-Type', 'text/event-stream');  
  	setInterval(() => {  
    		res.write(`data: ${new Date().toISOString()}\n\n`);  
 	}, 1000);  
});  

Плюсы:

  • Простота реализации.

  • Автоматическое переподключение.

Минусы:

  • Только сервер → клиент.

3. Long Polling

Клиент отправляет запрос, а сервер отвечает только когда есть данные.

Пример:

function fetchUpdates() {  
  	fetch('/poll')  
    		.then(response => response.json())  
    		.then(data => {  
      			console.log('Данные:', data);  
      			fetchUpdates(); // Новый запрос  
    		});  
}  

Плюсы:

  • Работает даже без WebSocket.

Минусы:

  • Высокая нагрузка на сервер.

Уровень

  • Рейтинг:

    5

  • Сложность:

    7

Навыки

  • JavaScript

    JavaScript

  • Networks

Ключевые слова

#websocket

#sse

Подпишись на React Developer в телеграм