Як інтегрувати операторську панель як віджету в CRM/ERP

ConnectiveOne дозволяє вбудувати операторську панель в CRM/ERP як віджет. Це дає можливість вести діалоги з клієнтами безпосередньо з карточки клієнта в CRM, не виходячи з системи.

Коли використовувати цю інтеграцію?

Потрібно вести діалоги з клієнтами безпосередньо з CRM
Потрібно переглядати історію діалогів з клієнтом в карточці CRM
Потрібно ініціювати новий діалог з клієнтом з карточки в CRM
Потрібно бачити всі діалоги з усіма клієнтами, не виходячи з CRM

Передумови

Для інтеграції в карточку клієнта/угоди

Активний акаунт у CRM (email), що співпадає з активним акаунтом у ConnectiveOne для кожного оператора
В карточку контакта/угоди/задачі підтягнуто номер телефону клієнта або інший ідентифікатор каналу — використовується для пошуку клієнта

Для інтеграції повного функціоналу панелі оператора

Активний акаунт у CRM (email), що співпадає з активним акаунтом у ConnectiveOne для кожного оператора

Як це працює?

Формується посилання з параметрами для автоматичної авторизації в ConnectiveOne. Це посилання використовується як URL для формування iframe віджету.

Інтеграція в карточку клієнта/угоди

Параметри посилання

Обов'язкові параметри:

user — email (login) під яким відбувається авторизація
redirect_module — автоматичний редірект на необхідну сторінку (наприклад OperatorPanelChats перекине одразу на сторінку з Чатами)
init_dialog — номер телефону клієнта
init_dialog_bot_id — ID бота через який буде іти переписка
init_dialog_channel — канал через який буде іти переписка
login_key — ключ авторизації для автологіну

Додаткові параметри:

hide_nav — якщо необхідно сховати доступ до меню та Хедеру
Мова передається як перший параметр en, uk, тощо

Приклад посилання:

https://instancename.connectiveone.io/autologin?en&user=email&login_key=#somkeyhere&redirect_module=OperatorPanelChats&hide_nav=1&init_dialog=380123456789&init_dialog_channel=whatsapp&init_dialog_bot_id=1

🚨 Важливо: Не афішуйте ці параметри і саме посилання без крайньої необхідності.

Створення діалогу

Кейс 1: Якщо знайдено діалоги з таким клієнтом:

Береться перший діалог зі списку знайдених та канал цього діалогу
Перевіряється у Агента по списку Діалогів чи є чат з таким Клієнтом
- Якщо такий діалог знайдено — Агент підключається до цього діалогу
- Якщо такий діалог не знайдено — створюється новий діалог з під'єднанням до нього Агента

Кейс 2: Якщо Клієнта не знайдено:

За допомогою параметру init_dialog_channel перевіряємо чи підключені в Системі Боти з таким каналом
При наявності таких Ботів, створюємо Новий Діалог та підключаємо Агента до діалогу

👉 Примітка: Якщо init_dialog_bot_id не вказано, то береться перший БотID з відповідним каналом.

JS скрипт для формування віджету

Для того щоб передати параметри з карточки клієнта та перевірити можливість ініціації діалога буде потрібен JS (JavaScript) код віджету.

Приклад для Zoho CRM:

<html>
<script>
document.addEventListener('DOMContentLoaded', function(){
  let src = 'https://instance.connectiveone.io/autologin?en&user=email&login_key=#somkeyhere&redirect_module=OperatorPanelChats&hide_nav=1&init_dialog=380123456789&init_dialog_channel=whatsapp&init_dialog_bot_id=1';

  function createFrame() {
    let frame = document.createElement("iframe");
    frame.setAttribute("src", src);
    frame.setAttribute("name", "ConnectiveOne");
    frame.setAttribute("id", "frame");
    frame.frameBorder = 0;
    frame.width = 100 + "%";
    frame.height = 700 + "px";
    document.getElementById("iframeHolder").appendChild(frame);
  }

  createFrame();
})
</script>
<body>
  <div id="iframeHolder"></div>
</body>
</html>

📖 Документація: Для Zoho CRM дивіться Widgets Overview | Online Help - Zoho CRM.

Призначення атрибутів

src: URL, що вказує на джерело вмісту для iframe (URL з параметрами авторизації)
name: Ім'я iframe встановлюється як "ConnectiveOne"
id: Ідентифікатор iframe встановлюється як "frame"
frameBorder: Прибрано рамку iframe для більш чистого вигляду
width та height: Ширина iframe задається на всю ширину сторінки (100%), а висота — фіксовано на 700px

Інтеграція повного функціоналу панелі оператора

Для інтеграції повного функціоналу необхідно вказати тільки:

user — email (login) під яким відбувається авторизація
redirect_module — автоматичний редірект на необхідну сторінку (наприклад OperatorPanelChats)

Додаткові параметри:

hide_nav — якщо необхідно сховати доступ до меню та Хедеру
Мова передається як перший параметр en, uk, тощо

Приклад посилання:

https://instancename.connectiveone.io/autologin?en&user=email&login_key=#somkeyhere&redirect_module=OperatorPanelChats&hide_nav=1

🚨 Важливо: Не афішуйте ці параметри і саме посилання без крайньої необхідності.

Безпека

Посилання з параметрами авторизації повинні бути захищені
Рекомендується використовувати HTTPS для всіх запитів
login_key повинен бути згенерований безпечним способом
Не передавайте login_key в логах або публічних місцях

Обмеження

Email оператора повинен співпадати в CRM та ConnectiveOne
Для ініціації діалогу необхідний номер телефону клієнта
Iframe може мати обмеження через CORS політику
Деякі CRM можуть мати обмеження на розмір iframe