nakama/EMPTY_SCREEN_FIX.md

157 lines
5.5 KiB
Markdown
Raw Permalink Normal View History

2025-12-01 05:40:27 +00:00
# Исправление: Пустой экран после верификации
## 🔴 Проблема
После успешной верификации UI открывается, но моментально пропадает (полностью пустой экран).
---
## ✅ Что исправлено
### 1. **Улучшена обработка ошибок**
- Добавлено подробное логирование в консоль браузера
- Теперь видно, на каком этапе происходит ошибка
### 2. **Исправлен пустой экран**
- Вместо `return null` теперь показывается сообщение с кнопкой перезагрузки
- Это помогает понять, что происходит
### 3. **Отложен запуск initDataChecker**
- `initDataChecker` теперь запускается только после успешной загрузки пользователя
- Это предотвращает преждевременную перезагрузку страницы
### 4. **Улучшена валидация данных**
- Проверяется, что `userData` действительно получен
- Если `null` или `undefined` - показывается ошибка
---
## 🔍 Как диагностировать
### Шаг 1: Откройте консоль браузера
1. В Telegram откройте приложение
2. Нажмите **F12** или **Cmd+Option+I** (Mac)
3. Перейдите на вкладку **Console**
### Шаг 2: Посмотрите логи
**Должны увидеть:**
```
[App] Начало инициализации...
[App] Telegram WebApp найден, initData: есть
[API] verifyAuth: отправка запроса...
[API] verifyAuth: получен ответ: { hasUser: true, userId: "...", username: "..." }
[App] verifyAuth вернул: данные пользователя
[App] Пользователь установлен, ID: ...
[App] Инициализация завершена, loading: false
```
**Если видите ошибку:**
```
[API] verifyAuth: ошибка: { message: "...", status: 401/500 }
[App] Ошибка инициализации: ...
```
---
## 🐛 Возможные причины
### 1. **Ошибка 401 (Unauthorized)**
**Причина:** `initData` невалиден или истек
**Решение:**
- Перезагрузите приложение в Telegram
- Убедитесь, что используете официальный клиент Telegram
### 2. **Ошибка 500 (Server Error)**
**Причина:** Проблема на backend
**Решение:**
```bash
# Проверьте логи backend
docker logs nakama-backend --tail 100
# Ищите ошибки:
# - "Ошибка verify"
# - "MongoDB connection"
# - "MinIO connection"
```
### 3. **userData = null/undefined**
**Причина:** Backend не вернул данные пользователя
**Решение:**
- Проверьте маршрут `/api/auth/verify` на backend
- Убедитесь, что пользователь существует в БД
- Проверьте, что `respondWithUser` работает правильно
### 4. **Ошибка в компонентах Feed/Layout**
**Причина:** Компонент падает при рендеринге
**Решение:**
- В консоли браузера будет **красная ошибка** с указанием файла и строки
- Проверьте, что все данные пользователя присутствуют (`user.settings`, `user.photoUrl`, etc.)
---
## 🔧 Быстрое решение
### 1. Перезагрузите приложение
```javascript
// В консоли браузера
window.location.reload()
```
### 2. Проверьте backend
```bash
# Проверьте, что backend работает
curl http://your-backend-url/api/health
# Проверьте логи
docker logs nakama-backend -f
```
### 3. Проверьте MongoDB
```bash
# Подключитесь к MongoDB
docker exec -it nakama-mongodb mongosh
# Проверьте пользователей
use nakama
db.users.find().limit(5)
```
---
## 📋 Контрольный список
- [ ] Консоль браузера открыта (F12)
- [ ] Видны логи `[App]` и `[API]`
- [ ] Нет красных ошибок в консоли
- [ ] Backend доступен (`/api/health`)
- [ ] MongoDB подключена
- [ ] Пользователь существует в БД
- [ ] `initData` валиден (не истек)
---
## 💡 Если все еще не работает
### Отправьте мне:
1. **Логи из консоли браузера** (скопируйте все сообщения)
2. **Логи backend** (`docker logs nakama-backend --tail 200`)
3. **Скриншот пустого экрана**
4. **Ошибки из консоли** (красные сообщения)
---
## ✅ После исправления
После применения исправлений вы должны видеть:
- ✅ Логи в консоли на каждом этапе
- ✅ Сообщение об ошибке вместо пустого экрана
- ✅ Кнопку "Перезагрузить" если что-то пошло не так
**Теперь откройте приложение и посмотрите консоль браузера!** 🔍