Встраиваемый виджет

Добавьте чат-виджет Iterna на любую страницу одним тегом <script>. Виджет монтируется в изолированный Shadow DOM, поэтому его стили не конфликтуют с сайтом.

Быстрый старт

Скопируйте сниппет в разделе Настройки → Виджет (он уже содержит публичный токен вашего сценария) и вставьте перед </body>:

<script
  src="https://app.example.com/widget/iterna-widget.js"
  data-token="<public_token>"
  data-mode="bubble"
  async
></script>

Цвета, заголовок, лаунчер, позиция и язык берутся из серверной конфигурации сценарий; любой атрибут data-* переопределяет серверное значение. Используйте data-mode="inline" вместе с data-target="#some-id", чтобы отрисовать чат внутри элемента, а не в плавающем пузыре.

Идентификация пользователя

Если страница уже знает, кто её посетитель, передайте виджету JWT, подписанный секретом встраивания вашего пространства (обновляется в Настройки → Виджет). Виджет хранит токен в браузере и прикрепляет его к каждому сообщению, чтобы бэкенд мог привязать диалог к этому пользователю.

Передайте статически через data-user-jwt:

<script
  src="https://app.example.com/widget/iterna-widget.js"
  data-token="<public_token>"
  data-user-jwt="<JWT пользователя>"
  async
></script>

…или вызовите iternaWidget.identify(jwt) в рантайме. Используйте shim с очередью команд, чтобы это работало даже до загрузки бандла:

<script>
  window.iternaWidget = window.iternaWidget || { _q: [] };
  iternaWidget.identify = iternaWidget.identify
    || function () { (iternaWidget._idq = iternaWidget._idq || []).push(arguments); };

  iternaWidget.identify("<JWT пользователя, подписанный секретом встраивания>");
</script>

Вызов браузерного JS из сценария

Сценарий может вызывать JavaScript, выполняемый на вашей странице (прочитать корзину, подсветить элемент, открыть модальное окно). Объявляйте функции через iternaWidget.defineFunction; обработчик остаётся в браузере, сценарий каждый ход получает только форму {name, description, parameters}.

<script>
  window.iternaWidget = window.iternaWidget || { _q: [] };
  iternaWidget.defineFunction = iternaWidget.defineFunction
    || function () { iternaWidget._q.push(arguments); };

  iternaWidget.defineFunction({
    name: "get_cart_total",
    description: "Возвращает текущую сумму корзины",
    parameters: { type: "object", properties: {} },
    handler: async () => ({ total: window.cart.total }),
  });
</script>

Когда сценарий вызывает get_cart_total, виджет запускает ваш обработчик и возвращает результат — синхронный round-trip, по которому сценарию может ветвиться.

Совет: каждый запуск изолирован и оплачивается по тарифу владельца сценария.