Тег скрипту: атрибути й джерела конфігурації

Віджет можна повністю налаштувати атрибутами тегу скрипту — без вбудованого скрипту, отже й за суворої Content Security Policy. Якщо ви віддаєте перевагу JavaScript, задайте ті самі поля через window.ReactiveChatSettings або ReactiveChat('boot', …).

Оформлення, тексти, головний екран, правила й тури зазвичай задаються в обліковому записі та надходять із сервера під час встановлення з’єднання. Ці атрибути призначені для параметрів окремої сторінки. Усі варіанти оформлення описано в розділі Налаштування.

Чотири джерела конфігурації та їхній пріоритет

Пізніше джерело має пріоритет; об’єднання пласке (об’єктне поле, як-от brand, замінюється повністю, а не об’єднується вглиб):

1. Стандартні значення віджета
2. Атрибути data-rc-* у тегу завантажувача
3. window.ReactiveChatSettings (задане до завантажувача)
4. Виклики ReactiveChat('boot', {...}) із черги в їхньому порядку

Невідомі віджету поля відкидаються, тому атрибут із помилкою введення мовчки не діє.

<script>
  window.ReactiveChatSettings = { locale: 'en', position: 'left' };
</script>
<script src="https://cdn.reactive.chat/loader.js"
        data-rc-site-key="SITE_KEY"
        async></script>

Як читаються значення атрибутів

Назва перетворюється з kebab case на camel case: data-rc-site-key → siteKey. Тип визначається стандартним значенням:

• Рядок — приймається без змін.
• Логічне значення — лише "false" і "0" є false; усе інше, зокрема порожній атрибут, є true.
• Список — через кому, наприклад "idle,pointer".
• Число або об’єкт — читається як JSON. Якщо JSON недійсний, залишається стандартне значення.

Читається лише тег, який зараз виконується (document.currentScript). Тому вбудовуйте завантажувач як класичний скрипт, а не з type="module".

Обов’язкове

• data-rc-site-key (рядок, обов’язковий) — ключ проєкту з облікового запису в розділі Проєкт → Встановлення. Шаблон [A-Za-z0-9_-]{8,64}. Якщо відсутній або недійсний, нічого не запускається — без повідомлення в консолі.

З’єднання й доставка

• data-rc-ws-url (рядок, необов’язковий) — адреса з’єднання чату. Якщо не задана, виводиться з розташування loader.js (cdn.reactive.chat → wss://ws.reactive.chat/rc_wss/). Обов’язкова, щойно ви завантажуєте loader.js не з cdn.reactive.chat, а також для доменів із двоскладовим закінченням, як-от .co.uk. Див. Транспорт.
• data-rc-cdn-base (рядок, необов’язковий) — тека завантаження ядра й модулів. Стандартно — тека loader.js.
• data-rc-core-url (рядок, необов’язковий) — фіксована адреса ядра замість core.<hash>.js із тієї самої теки. Лише для особливих випадків, наприклад власного дзеркала.
• data-rc-transport (http, необов’язковий) — примусово вмикає резервний канал HTTP від початку. Працює на будь-якому елементі, наявному в документі під час запуску; альтернатива — ReactiveChatSettings.transport = 'http'. Через boot не діє.
• data-rc-max-retries (число, стандартно 2) — повтори, якщо ядро не завантажується (інтервал 300 мс × спроба).

Мова, тема, рух

• data-rc-locale (рядок, стандартно auto) — de, en або pl. auto бере <html lang>, потім мову браузера, інакше — англійську. Інші мови повертаються до англійської.
• data-rc-theme (auto | light | dark, стандартно auto) — auto відповідає світлому/темному режиму сторінки, інакше — системі.
• data-rc-motion (auto | reduced | full, стандартно auto) — анімації; auto відповідає prefers-reduced-motion.
• data-rc-strings (об’єкт JSON, стандартно {}) — перевизначає окремі тексти, наприклад {"a11y.launcher":"Open help"}. Інакше тексти задаються в обліковому записі (Налаштування).

Показ і розташування

• data-rc-position (right | left, стандартно right) — кут кнопки чату й вікна.
• data-rc-offset (JSON, стандартно {"x":20,"y":20}) — відстань від краю в пікселях, на додачу до безпечної області.
• data-rc-z-index (число, стандартно 2147483000).
• data-rc-avoid-overlap (логічне значення, стандартно true) — обходить закріплені панелі внизу (банери cookie, панелі кошика).
• data-rc-hide-launcher (логічне значення, стандартно false) — без значка чату; вікно відкривається лише власними посиланнями або через JavaScript API. Хмаринки тоді пригнічуються. Діє незалежно від налаштування облікового запису.
• data-rc-auto-open (логічне значення, стандартно false) — відкриває вікно після запуску.
• data-rc-isolation (shadow | iframe, стандартно shadow) — віджет перебуває в закритому shadow DOM; iframe відображає вікно у фреймі для сторінок із дуже агресивними глобальними стилями.
• data-rc-brand (об’єкт JSON) — колір бренду й форма кнопки чату. Завантажувач одразу читає з нього primary (#rrggbb), onPrimary, radius та launcher.shape (circle, rounded, square, bubble, leaf), launcher.size (44–72) і launcher.size_m; решту перевіряє ядро. Фрагмент з облікового запису вже містить ці значення; без дійсного primary завантажувач не показує тимчасової кнопки, а чекає кольору із сервера (без зміни кольору, але кнопка пізніше). Якщо об’єкт містить лише ці початкові поля, після встановлення з’єднання діє оформлення облікового запису; з додатковими полями (наприклад accent) — ваше. Докладніше — Налаштування.
• data-rc-logo (об’єкт JSON) — src, placement (launcher, header, both), height, alt.
• data-rc-custom-css (рядок) — власний CSS усередині shadow DOM. Див. Налаштування.

Завантаження й поведінка

• data-rc-load-triggers (список, стандартно всі п’ять) — коли завантажується ядро: idle (браузер не зайнятий), pointer (миша чи палець на кнопці чату), command (команда API, крім boot, update, track, identify), frustration (сигнал MousePlayer), push. Перший тригер перемагає.
• data-rc-idle-timeout-ms (число, стандартно 3000) — тайм-аут тригера idle.
• data-rc-consent (auto | granted | denied, стандартно auto) — стан згоди. auto запитує платформу згоди (IAB TCF v2 через __tcfapi, інакше consented.eu); granted/denied фіксує його. Див. Інтеграція конфіденційності.
• data-rc-dom-spiegel (логічне значення, стандартно true) — false не надсилає асистенту тексту сторінки й вимикає «Покажіть».
• data-rc-promo (логічне значення, стандартно true) — false приховує промокартку на цій сторінці.
• data-rc-launcher-selector (CSS-селектор) — натискання відповідних елементів перемикає вікно. Працює лише після завантаження ядра; для посилань, що мають працювати одразу, використовуйте data-rc-open (нижче).
• data-rc-dnd (логічне значення, стандартно false) — початкове значення «Не турбувати».
• data-rc-session-ttl-ms (число, стандартно 1800000) — як довго використовується сеанс MousePlayer.
• data-rc-debug (логічне значення, стандартно false) — діагностичний вивід у консолі. Рівнозначно: localStorage.setItem('rc_debug', '1') у браузері.

Атрибути на інших елементах сторінки

Відкрити чат (працює одразу, ще до завантаження ядра):

• data-rc-open — на будь-якому елементі; натискання відкриває чат поруч. data-rc-open="corner" відкриває його в куті.
• href="#rc-open" або href="#reactive-chat" — те саме для посилань.
• data-rc-anchor="none" — як corner.
• data-rc-message — текст, що вписується в поле введення, але не надсилається (щонайбільше 200 символів).
• data-rc-tab — msg, home або help: яка вкладка попереду.

Докладно: Відкриття чату власним посиланням або кнопкою.

Текст конфіденційності:

• data-rc-privacy — місце для розділу про reactive.chat у політиці конфіденційності, з data-lang, data-heading (2–6) та data-email. Стан у data-rc-privacy-state (loading, done, error). Див. Інтеграція конфіденційності.

Виключення тексту сторінки:

• data-rc-private або рівнозначний data-rc-ignore — це піддерево ніколи не надсилається асистенту як текст сторінки й ніколи не стає ціллю «Покажіть».

<aside data-rc-private>
  Internal notes the assistant should not read.
</aside>

Параметри URL

• ?rc_ab=A до E — примусово задає варіант поточного A/B-тесту для перевірки якості (див. Налаштування).

Під час завантаження віджет не обробляє інших параметрів адреси.

Повторне вбудовування

Якщо завантажувач є на сторінці двічі (наприклад через шаблон і менеджер тегів), запускається лише перший із дійсним ключем сайту; другий нічого не робить. Перший тег із недійсним ключем не блокує правильного другого.

Далі: JavaScript API · Події