Чат в окне визита и журнале записи

Входные гет-параметры для iframe

Обязательные гет-параметры

1. salon_id: int — id текущего салона, куда встраивается виджет.
2. hash: string — строка, полученная посредством конкатенации salon_id и токена партнера, хешированная алгоритмом SHA1.

Опциональные

1. phone:string — текущий номер телефона клиента, находящийся в поле «Телефон» окна записи. По этому параметру виджет должен принимать вид для окна записи.

Общение с YCLIENTS через postMessage

1. Изменение номера телефона в окне записи. Данный ивент будет поступать в момент изменения инпута «Телефон» в окне создания записи.

Примеры пэйлоада:

{action: “phone_change”, phone: “9012314372”, phone_code: “7"}, где phone: string — номер телефона, без кода страны, phone_code: string — телефонный код страны.

{action: “phone_change”, full_phone: “+79012314372"}, где full_phone: string — номер телефона с кодом страны.

Технические ограничения

1. В коде виджета должен быть предусмотрен fallback на использование localStorage/sesionS тоtorage/cookie, так как виджет встраивается через iframe и если пользователь сидит в режиме инкогнито, то при попытке обратиться к вышеописанным сервисам может происходить ошибка Access is denied for this document (ссылка на проблему). Самым простым решением будет отказаться от этих сервисов. Если это невозможно, то следует либо предусмотреть fallback для них, либо же показывать соответствующий экран о невозможности работы виджета.
2. В случае, если авторизация в виджете требует проставление и дальнейшее считывание cookie, то у куки авторизации обязательно должен быть проставлен атрибут SameSite со значением ‘none’. Без этого параметра виджет не сможет достать ее, в связи с кроссдоменным взаимодействием.
   
   Важно: Помимо этого виджет будет недоступен для браузера сафари, в связи с нестабильным механизмом считывания кук при кроссдоменном взаимодействии.

Требования по производительности

1. Отсутствие спама запросов в рантайме, необходимо минимизировать их количество.
2. Суммарный размер production-ready js/css файлов менее 700kb.
3. Размер отдельно взятого production-ready js/css файла менее 150kb.
4. Потребление памяти (вкладка Memory, chrome dev-tools), составляет менее 50% от памяти, потребляемой YCLIENTS.
5. Отсутствие регулярных сложных вычислений, реакций на различные события (работа с API, web-сокетами). Работа виджета не должна блокировать пользовательское взаимодействие с интерфейсом YCLIENTS. Диагностировать длительные «провисания» можно на вкладке «Performance» в chrome dev-tools (они будут помечены красным флагом). Более подробно с инструментом можно ознакомиться в статье от гугла.

Особенности жизненного цикла виджета

Виджет не инициализируется при инициализации журнала записи, а ждет открытия через пользовательское взаимодействие (реализовано на стороне YCLIENTS). Причем после инициализации виджета, в целях производительности, происходит его уничтожение, в случае, если пользователь закрыл виджет дольше, чем на 5 минут. 

Таким образом в рамках одной пользовательской сессии может происходить несколько инициализаций виджета (как в журнале записи, так и в окне записи), он должен быть готов к этому, т. е. занимать минимально возможное время инициализации, отправлять минимально возможное количество запросов, загружать как можно меньше исходного кода.

Передача новых сообщений

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

POST api.yclients.com/marketplace/application/new_message

• application_id — ID приложения.
• salon_id — ID салона.
• phone_from — с какого номера пришло сообщение (при наличии).
• message — текст сообщения (при наличии).
• name — имя клиента, который написал сообщение (при наличии). Если присылать пустую строку в поле name — YCLIENTS сам сохранит лида, но без имени, но для пользователей будет намного лучше, если партнер начнет присылать имена из мессенджера.

Поиск клиента через чат

В боковой панели внутри журнала записи YCLIENTS возможно реализовать взаимодействие чата и поиска клиента по номеру телефона. Партнер может отрисовать кнопку внутри iframe виджета чата, по которой возможен поиск клиента в клиентской базе YCLIENTS. Для этого нужно:

• отрисовать кнопку поиска по клиентской базе YCLIENTS рядом с профилем/аватаром пользователя, который пишет в чат;
• вызвать window.parent.postMessage с:

{
  action: 'load_client',
  payload: '+12345678' // либо номер либо строка, по которой клиента можно будет найти в другом табе
}

Передача чата при подключении нового клиента

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