> For the complete documentation index, see [llms.txt](https://docs.iexexchanger.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.iexexchanger.com/learn/5.-klientskii-sait/08-online-chat.md).

# Онлайн-чат и чат в заявках

Подключите виджет поддержки, настройте чат внутри заявки и безопасно проверьте пользовательский код

## Что вы получите

На клиентском сайте работает выбранный виджет поддержки, а в заявках доступен отдельный диалог с оператором только при нужных статусах. Команда понимает, какие данные передаются внешнему сервису, как проверять файлы и уведомления и как отключить один контур, не затрагивая другой.

Откройте **«Настройки» — «Общие настройки» — «Дополнительно» — «Онлайн чат»**. На странице **«Настройки онлайн-чата»** используются самостоятельные вкладки:

{% tabs %}
{% tab title="Онлайн чат" %}
Подключает виджет поддержки на публичном сайте: iEXChat, JivoSite, InterCom, Tawk, Talk-me или собственный код.
{% endtab %}

{% tab title="Чат в заявках" %}
Управляет перепиской клиента с оператором внутри конкретной заявки, допустимыми статусами, файлами и доставкой уведомлений.
{% endtab %}

{% tab title="Опции для Jivosite" %}
Появляется для JivoSite и определяет, когда передавать событие новой заявки и разрешённую информацию о клиенте.
{% endtab %}
{% endtabs %}

Виджет поддержки и чат заявки могут использоваться одновременно, но один не заменяет другой.

## Подключите iEXChat

{% stepper %}
{% step %}

### Подготовьте публичные данные виджета

В iEXChat получите **Site Public ID** и публичный HTTPS-адрес loader-скрипта. Обычно адрес имеет вид `https://chat.example.com/widget.js`. Серверный секрет в эту форму не вводится.
{% endstep %}

{% step %}

### Выберите iEXChat

На вкладке **«Онлайн чат»** включите **«Включить онлайн чат»** и в поле **«Тип онлайн чата»** выберите **iEXChat**.
{% endstep %}

{% step %}

### Заполните соединение

Укажите **Site Public ID** и **«Адрес скрипта чата»**. Используйте полный публичный HTTPS-адрес без локального имени и без закрытого IP.
{% endstep %}

{% step %}

### Сохраните и откройте клиентский сайт

Проверьте виджет в новой сессии браузера, на телефоне и компьютере. Переключите язык и направление, затем создайте принадлежащую вам контрольную заявку.
{% endstep %}
{% endstepper %}

iEXChat получает публичный контекст по мере работы клиента: язык, выбранное направление, создание заявки, нажатие **«Я оплатил»** и последующее изменение статуса. Ошибка или недоступность виджета не должна блокировать форму обмена.

{% hint style="warning" %}
Публичный ID идентифицирует сайт, но не является серверным секретом. Контекст конкретной заявки должен передаваться только владельцу или пользователю с подтверждённым доступом. Одной публичной ссылки отслеживания недостаточно для действий от имени клиента.
{% endhint %}

## Подключите другой готовый виджет

Для JivoSite, InterCom, Tawk или Talk-me выберите точный тип и заполните идентификатор, который выдал провайдер. После сохранения проверьте:

* открытие и закрытие виджета;
* отправку сообщения в обе стороны;
* язык и адаптивность;
* отсутствие перекрытия кнопки обмена и важных полей;
* правила передачи E-mail, телефона и данных заявки;
* работу при временной недоступности провайдера.

Для JivoSite на отдельной вкладке включайте событие новой заявки и передачу данных клиента только после согласования состава данных. Используйте доступные теги из редактора, а не записывайте их по памяти.

## Добавьте пользовательский код

Тип **«Пользовательский код»** нужен для сервиса, которого нет в готовом списке.

{% hint style="danger" %}
Код выполняется на публичных страницах сайта с правами браузера посетителя. Используйте только официальный фрагмент доверенного поставщика, проверьте его политику данных и выдайте право управления пользовательским онлайн-чатом только ответственному администратору.
{% endhint %}

{% stepper %}
{% step %}

### Выберите формат

**HTML** подходит для готового блока с тегами `<script>`, разметкой и стилями. **JavaScript** — для чистого кода без тегов `<script>`.
{% endstep %}

{% step %}

### Заполните основной язык

Вставьте **«Код виджета»** на основном языке сайта. Для остальных активных языков можно сохранить отдельный вариант; пустая языковая вкладка использует код основного языка.
{% endstep %}

{% step %}

### При необходимости загрузите файл

Кнопка **«Загрузить из файла»** принимает текстовые `.html`, `.htm`, `.js` и `.txt` в строгой кодировке UTF-8. Размер кода не должен превышать 256 КБ. После чтения файла код всё равно нужно проверить и сохранить.
{% endstep %}

{% step %}

### Проверьте автоматическую обработку

Если редактор удалил форматирование сообщения, изучите получившийся код. **«Отменить обработку»** возвращает исходный текст до сохранения, а **«Вернуть предыдущую версию»** восстанавливает ранее сохранённый вариант.
{% endstep %}

{% step %}

### Включите только после проверки

Пустой или некорректный код нельзя включать. Сначала сохраните выключенный вариант, проверьте все языки, затем включите его и откройте публичный сайт без административной сессии.
{% endstep %}
{% endstepper %}

Предпросмотр в админке намеренно не исполняет пользовательский JavaScript. Фактический результат проверяется на клиентском сайте. Если сохранение уже выполняется в другой вкладке, дождитесь его окончания и перечитайте сохранённое значение: параллельная запись защищена от незаметной перезаписи.

## Настройте чат внутри заявки

Перейдите на вкладку **«Чат в заявках»**.

{% stepper %}
{% step %}

### Выберите статусы

Включите чат и отметьте только те статусы, в которых команда действительно отвечает клиенту. Проверьте появление и исчезновение формы при переходах между статусами.
{% endstep %}

{% step %}

### Настройте уведомления

При необходимости включите Telegram-уведомление операторам о новом сообщении клиента и E-mail клиенту после ответа менеджера. Эти переключатели используют уже настроенные каналы; сначала завершите уроки по [уведомлениям](/learn/6.-e-mail-i-uvedomleniya/01-notification-center.md), [E-mail](/learn/6.-e-mail-i-uvedomleniya/email.md) и [Telegram](/learn/7.-telegram/08-telegram-bot.md).
{% endstep %}

{% step %}

### Ограничьте файлы

Если клиентам нужны вложения, разрешите только необходимые расширения из системного списка: PNG, JPG, JPEG и PDF. Укажите лимит от 1 до 50 МБ с учётом ограничений PHP и веб-сервера. SVG и произвольные расширения не разрешаются.
{% endstep %}

{% step %}

### Выберите индикатор набора

**«Typing через Reverb»** даёт оперативный индикатор при доступной realtime-службе. При её отказе переписка должна продолжить обновляться резервным способом.
{% endstep %}

{% step %}

### Создайте быстрые ответы

Добавьте только утверждённые фразы оператора. Первые две отображаются кнопками, остальные — в меню. Не включайте в шаблон реквизиты, секреты или обещание результата, который ещё не подтверждён.
{% endstep %}
{% endstepper %}

## Проверьте весь сценарий

1. Откройте сайт как новый посетитель и отправьте сообщение через публичный виджет.
2. Переключите язык и направление; убедитесь, что виджет не дублируется после переходов.
3. Создайте принадлежащую вам заявку и откройте чат в разрешённом статусе.
4. В карточке заявки раскройте чат, затем откройте окна **«Выдать реквизиты»**, **«Заменить реквизиты»** и сведения о выплате, если она используется. На телефоне и компьютере окна должны оставаться поверх чата, кнопка чата — доступной, а прокрутка — возвращаться в ожидаемое положение после закрытия.
5. Отправьте текст клиента, ответ оператора и один обезличенный файл каждого разрешённого типа.
6. Попробуйте запрещённое расширение и файл больше лимита — сервер должен отклонить их понятной ошибкой.
7. Проверьте Telegram оператора и E-mail клиента отдельными реальными сообщениями.
8. Переведите заявку в статус вне списка и убедитесь, что новый диалог недоступен.
9. Временно остановите Reverb и проверьте резервное обновление, затем восстановите службу.

## Этап завершён, если

* [ ] выбранный виджет открывается на публичном сайте и не мешает обмену;
* [ ] iEXChat использует только Site Public ID и публичный адрес скрипта;
* [ ] язык, направление и разрешённый контекст заявки передаются корректно;
* [ ] пользовательский код, если он нужен, проверен для всех активных языков;
* [ ] право управления пользовательским кодом выдано отдельной ответственной роли;
* [ ] чат заявки доступен только в выбранных статусах;
* [ ] чат не перекрывает выдачу, замену реквизитов и сведения о выплате на узком и широком экране;
* [ ] ограничения файлов проверены на разрешённом и запрещённом примерах;
* [ ] быстрые ответы не содержат изменяемых финансовых данных;
* [ ] Telegram, E-mail, realtime и резервное обновление проверены раздельно;
* [ ] команда умеет выключить публичный виджет и чат заявки независимо.

Далее настройте [E-mail и маршрутизацию уведомлений](/learn/6.-e-mail-i-uvedomleniya/01-notification-center.md).


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.iexexchanger.com/learn/5.-klientskii-sait/08-online-chat.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.