/
Percival
/
reactJS_course
Обзор
Документация
Войти
/
Percival
/
reactJS_course
Код
Запросы
4
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
task6
task_1_fsd/src/features/refExamples/WebSocketLogger.tsx
47 строк
1 KB
Rituparn
Added the 5th task
26 окт 2025, 19:34
26 окт 2025, 19:34
72790f9
Код
Авторство
О чём код?
import { useRef, useEffect, useState } from 'react'; export const WebSocketLogger = () => { const socketRef = useRef<WebSocket | null>(null); const [status, setStatus] = useState<'disconnected' | 'connecting' | 'connected'>('disconnected'); useEffect(() => { const wsUrl = 'wss://echo.websocket.org/'; setStatus('connecting'); console.log('WebSocket: Connecting...'); socketRef.current = new WebSocket(wsUrl); socketRef.current.onopen = () => { console.log('WebSocket: Connected'); setStatus('connected'); socketRef.current?.send('Hello from WebSocketLogger!'); }; socketRef.current.onmessage = (event) => { console.log(`WebSocket message: ${event.data}`); }; socketRef.current.onerror = (error) => { console.error('WebSocket error:', error); }; socketRef.current.onclose = () => { console.log('WebSocket: Connection closed'); setStatus('disconnected'); }; return () => { console.log('WebSocket: Cleaning up'); socketRef.current?.close(); }; }, []); return ( <div> <h3>WebSocketLogger</h3> <p>Status: {status}</p> <p>Check console for WebSocket messages</p> </div> ); };