Веб-мультичат для стримеров, который объединяет сообщения Twitch, Kick, VK Видео Live и YouTube Live в одной ленте. Интерфейс работает в обычном браузере и как док-панель OBS Studio.
- Добавьте в док-панель вашего OBS/Streamlabs адрес https://annacodit.github.io/MultiChat/ или просто откройте его в браузере.
- Укажите нужные каналы и нажмите «Сохранить и подключиться».
Устанавливать расширения или отдельные программы не требуется.
Настройки сохраняются в localStorage конкретного браузера или профиля OBS, поэтому на другом устройстве их потребуется указать заново. При первом открытии в ленте также показываются демонстрационные сообщения интерфейса — они не получены из реальных чатов.
| Платформа | Подключение | Важные особенности |
|---|---|---|
| Twitch | Прямой WebSocket IRC | Сообщения, цвета ников, IRC-бейджи, нативные смайлики и popup профиля по клику на ник. |
| Kick | API через CORS-прокси и прямой Pusher WebSocket | Для fra3a предусмотрен резервный Chatroom ID. Подключение произвольных каналов зависит от доступности Kick API для прокси. |
| VK Видео Live | Centrifugo WebSocket или HTTP polling | VK блокирует WebSocket со сторонних публичных доменов, поэтому на GitHub Pages коннектор автоматически получает последние сообщения через прокси раз в четыре секунды. |
| YouTube Live | HTML/Innertube polling через прокси | Поддерживаются хэндл канала, URL и Video ID. Публичная версия направляет YouTube-запросы через настроенный серверный SOCKS5-прокси. |
- единая лента и отдельные индикаторы состояния платформ;
- автоматическое переподключение или резервный режим там, где это поддерживается коннектором;
- нативные Twitch/YouTube-смайлики, а также 7TV, BetterTTV и FrankerFaceZ;
- бейджи Twitch, Kick и YouTube;
- сворачивание ответов чаттерсов друг другу в плашку
[чаттерсы общаются]; - защита сообщений, адресованных стримеру, от автоматического скрытия;
- отметка первого сообщения зрителя за настраиваемый период;
- изменение размера шрифта и лимита сообщений в ленте;
- безопасное экранирование пользовательского HTML.
GitHub Pages содержит только статический frontend, но приложение не является полностью автономным. Запросы, которым внешние платформы не разрешают CORS, проходят через https://fra3a.ru/tools/proxy/.
Прокси используется для:
- определения Chatroom ID и загрузки канальных смайликов Kick;
- резервного получения сообщений VK Видео Live;
- поиска трансляции и чтения чата YouTube.
Если собственный прокси недоступен, приложение пробует публичные CORS-сервисы, но они являются только аварийным fallback и не гарантируют работу. Twitch IRC и платформенные WebSocket-подключения, не требующие предварительного HTTP-запроса, открываются браузером напрямую.
Не рекомендуется открывать index.html через file://: Origin null и ограничения браузера ломают часть сетевых запросов. Запускайте каталог через локальный HTTP-сервер, например:
python -m http.server 8088После этого откройте http://localhost:8088/.
Автоматические тесты не требуют сторонних npm-зависимостей:
npm testПодробное описание архитектуры, прокси и известных ограничений находится в docs.md.