Встречается на собеседованиях • сегодня

Какой подход к работе с WebSocket в React

Для работы с WebSocket в React можно использовать кастомный хук, который создает соединение, обрабатывает сообщения и закрывает соединение при размонтировании компонента. Пример:

jsx

import { useEffect, useRef } from 'react';

function useWebSocket(url, onMessage) {
  const ws = useRef(null);

  useEffect(() => {
    ws.current = new WebSocket(url);
    
    ws.current.onmessage = (event) => {
      onMessage(JSON.parse(event.data));
    };

text

return () => {
  if (ws.current) {
    ws.current.close();
  }
};

}, [url, onMessage]);

const sendMessage = (message) => {
if (ws.current && ws.current.readyState === WebSocket.OPEN) {
ws.current.send(JSON.stringify(message));
}
};

return { sendMessage };
}

text


Ключевые моменты:
1. Используем `useRef` для хранения сокета
2. Создаем соединение в `useEffect`
3. Очищаем ресурсы при размонтировании
4. Предоставляем метод `sendMessage` для отправки данных
5. Колбэк `onMessage` обрабатывает входящие сообщения

Для сложных случаев можно использовать библиотеки типа `socket.io-client` или `reconnecting-websocket`.

Софи собрала все вопросы. Тренируйся и получай
офферы быстрее!

Попробовать бесплатно

Следующий вопрос

Это единственный вопрос по вашему фильтру

как отвечать на вопрос

пример собеседования

фреймворки на собеседовании

типичные вопросы junior

интервью вопросы и ответы