Что такое виджет SupportHub
Embed-плагин — кнопка-пузырь в углу сайта, по клику открывает чат, базу знаний, новости и mini-app внутри одной панели.
Виджет — это один внешний JavaScript-файл, который вы вставляете на свой сайт. После загрузки он сам монтирует FAB-кнопку (floating action button), панель с табами и подключается к нашему API. Никаких iframe, никаких backend-вызовов с вашей стороны — всё инкапсулировано внутри bundle.
Из чего состоит виджет
FAB и панель
Круглая кнопка в углу + панель 400×640 на десктопе и fullscreen-overlay на мобиле (<640px). Цвет, позиция, border-radius, текст кнопки и форма логотипа (круг / скруглённый / квадрат) настраиваются.
Вкладки
Главная · Чат · База знаний · Новости · Mini App. Help / News / MiniApp включаются флагами в Builder; неактивные таб-кнопки в навигации не отображаются.
WebSocket
Реал-тайм входящие сообщения, system-cards (assigned / transferred / closed), реакции, индикатор «оператор прочитал», edit/delete events.
Privacy
ID визитора (vs_*) хранится в 5 tier'ах одновременно — cookie, localStorage, sessionStorage, IndexedDB и legacy LS-ключ — для устойчивости к Safari ITP / private mode / sandboxed iframe. Контент сообщений — только в нашей БД, никуда наружу не уходит.
Как настраивается
Все параметры живут в одном JSON-конфиге cfg, который редактируется через Widget Builder (/settings/widget-builder) — live-preview UI с 23 секциями, сгруппированными по смыслу:
- Бренд — Brand (цвет, логотип-upload с выбором формы, тема, «Powered by» toggle), Background, IconPack, EmojiPack, BotProfile
- Контент — Welcome (hero, CTA, bot menu, pinned banner), Tabs, Forms (pre-chat поля), SystemMessages, Translation
- Поведение — Conversation (реакции, inline keyboards, cookie_domain), Hours (рабочее время + away/greeting), EmailBridge, ReplyKeyboards, QuickReplies, SlowMode/BannedWords
- Расширения — Stories, MiniApp, PinnedBanner
- Безопасность и Advanced — Privacy, Advanced (custom CSS, kill-switch, keyword routing rules)
Сохранение делает draft; чтобы изменения увидели посетители, нужно нажать Publish. На платных тарифах есть approval-flow (editor → approver) и scheduled publish с audit log.
Где и как доступен
Поддерживаемые браузеры
Bundle собран esbuild под target: es2018. Тестируется в Chrome, Safari, Firefox, Edge — последние две major-версии. IE11 и старые мобильные WebView — не поддерживаются и не планируются.
Размер
Bundle (/widget-bundle) — около 410 KB после обфускации (≈110 KB gzip). Подгружается асинхронно, не блокирует рендеринг страницы; FAB появляется через 50–100 ms после загрузки. Конфиг виджета инлайнится в preamble того же ответа (/widget-bundle?ws=…) — отдельного запроса за /config нет.
Cross-domain
Виджет работает на любом домене — workspace_id передаётся через query-параметр ?ws= в URL скрипта, а CORS на бэке разрешает * для embed-эндпоинтов (/api/webhooks/widget/*). Если нужен whitelist доменов для безопасности — задействуйте embed-secret через data-token="…" (см. установку).
Cross-subdomain
Если ваш сайт живёт на нескольких поддоменах (example.com + app.example.com) и хотите чтобы один и тот же визитор сохранял одну беседу — задайте cookie_domain в секции Conversation Builder'а или передайте data-cookie-domain=".example.com" прямо в теге. Подробнее — в справочнике для разработчиков.