3.7 KiB
3.7 KiB
📝 Исправление WebSocket ошибки - Резюме
🔧 Что было исправлено
1. Файл: frontend/src/hooks/useWebSocket.ts
Проблема:
- Код неправильно обрабатывал переменную окружения
NEXT_PUBLIC_WS_URL - Если URL содержал протокол (
ws://localhost:9000), код добавлял протокол снова →ws://ws://localhost:9000/ws/
Решение:
- Добавлена проверка: если URL уже содержит протокол - используем его как есть
- Если URL это только хост - добавляем протокол
- Добавлено логирование:
console.log('🔄 Подключение к WebSocket:', wsUrl)
Измененная логика:
// ✅ ДО (НЕПРАВИЛЬНО):
const host = process.env.NEXT_PUBLIC_WS_URL || 'localhost:9000';
const wsUrl = `${protocol}//${host}/ws/?token=${token}`;
// Результат: ws://ws://localhost:9000/ws/?token=... ❌
// ✅ ПОСЛЕ (ПРАВИЛЬНО):
if (envWsUrl.startsWith('ws://') || envWsUrl.startsWith('wss://')) {
wsUrl = `${envWsUrl}/ws/?token=${token}`;
}
// Результат: ws://localhost:9000/ws/?token=... ✅
2. Файл: frontend/QUICKSTART.md
Изменения:
- ✅ Добавлена демонстрация правильного запуска Daphne
- ✅ Указано что НЕ нужно использовать
runserverдля WebSocket - ✅ Добавлена секция "Проверка WebSocket подключения" с подробной диагностикой
- ✅ Расширена секция "Проблемы?" с решением для
WebSocket error: {} - ✅ Добавлены инструкции по проверке портов в Windows
3. Файл: docs/diagnostic/WEBSOCKET_FIX.md (новый)
- 📋 Полная диагностика проблемы с WebSocket
- 🔍 Шаг-за-шагом решение проблемы
- 🛠️ Скрипты для проверки портов и процессов
- ✅ Чек-лист для быстрой проверки
🚀 Что делать дальше
1. Убедитесь что используется .env.local (не .env)
# frontend/.env.local (для локальной разработки)
NEXT_PUBLIC_WS_URL=ws://localhost:9000
NEXT_PUBLIC_BACKEND_URL=http://localhost:9000
2. Перезапустите backend с Daphne
cd backend
.venv/Scripts/daphne -b 0.0.0.0 -p 9000 eusrr_backend.asgi:application
3. Перезагрузите frontend
cd frontend
npm run dev
4. Проверьте в DevTools
- F12 → Console → убедитесь что видите
🔄 Подключение к WebSocket: ws://localhost:9000/... - F12 → Network → WS → должен быть статус 101 Switching Protocols ✅
📌 Ключевые моменты
| Что | ❌ НЕПРАВИЛЬНО | ✅ ПРАВИЛЬНО |
|---|---|---|
| Запуск backend | python manage.py runserver |
.venv/Scripts/daphne -p 9000 eusrr_backend.asgi:application |
| .env файл | .env (production) |
.env.local (development) |
| WebSocket URL | wss://corp.robotail.pro |
ws://localhost:9000 |
| Логирование | Нет | 🔄 Подключение к WebSocket: ... |
🔗 Дополнительно
- 📚 Полная диагностика: docs/diagnostic/WEBSOCKET_FIX.md
- 📖 Quickstart: frontend/QUICKSTART.md