Вбудовування: інтегруйте телефонну станцію у ваше програмне забезпечення

Якщо у вас є адреса вашої CRM, програма технічного обслуговування або будь-який веб-додаток, ви можете відкрити екрани АТС та веб-телефон у вашому інтерфейсі. Живі дзвінки, записи дзвінків, голосові записи, пауза, автоматичний набір, блокування номерів та телефон у браузері можуть бути вбудовані таким чином.

PHP не потрібен. Працює з простим HTML, jQuery, React або будь-яким фреймом. Екрани відкриваються лише на доменах, які ви вказали.

Базова адреса: https://api.buluthat.com

1. Створіть код вбудовування

У панелі Операції підписки > Коди вкладання (CRM) відкрийте сторінку. Якщо ви дистриб'ютор, виконайте цю роботу в Панелі дистриб'ютора > Вбудовування та API з сторінки, ви вибираєте клієнта.

Ваш код для вбудовування wk_ починається з. Цей код не є секретним; він видимий у вихідному коді вашої сторінки. Походить з дозволеного списку доменів безпеки та з наведених нижче методів входу.

2. Вставте код на свою сторінку

Один рядок

<div id="santral" style="height:720px"></div>
<script src="https://api.buluthat.com/assets/js/embed.js" data-key="wk_..." data-page="live_monitor" data-target="#santral"></script>

jQuery

<script src="https://api.buluthat.com/assets/js/embed.js"></script>
<script>
  $(function () {
    var santral = $('#santral').buluthat({ key: 'wk_...', page: 'report_calls' }).data('buluthat');
  });
</script>

Простий iframe

<iframe src="https://api.buluthat.com/embed.php?w=wk_...&page=live_monitor"
        style="width:100%;height:720px;border:0" allow="microphone; autoplay"></iframe>

Веб-телефон в iframe allow="microphone" є обов'язковим. embed.js він самостійно додасть це.

3. Екрани

4. Аутентифікація

a) вхід через iframe

Це метод за замовчуванням. Користувач вводить електронну пошту та пароль у рамці при першому відкритті; якщо увімкнено двоетапну перевірку, також запитується код. Сесія дійсна лише для цього вбудованого коду та вибраних екранів.

Деякі браузери (особливо Safari) повністю блокують куки з фреймів інших сайтів. У цьому випадку на екрані входу Відкрити в новому вікні посилання видаляється. Для постійного рішення використовуйте підписане посилання.

b) Підписане посилання з сервера (рекомендується)

Ваш користувач CRM вже увійшов у свою систему. Ваш сервер Buluthat для цього користувача 2 хвилин дійсно, одноразовий отримує вхідне посилання та iframe' src надається значення. Користувач також не вводить пароль.

Ключ: У обліковому записі клієнта API Ключі з сторінки Вбудовування створіть комплексний ключ. Якщо ви дистриб'ютор, перейдіть до Панелі дистриб'ютора > Вбудовування та API > API-ключ дистриб'ютора використовуйте; цей ключ дійсний для всіх ваших клієнтів. Ключ зберігається лише на вашому сервері, не переходить у браузер.

curl -X POST 'https://api.buluthat.com/api/embed.php?action=session' \
  -H 'Authorization: Bearer bt_...' \
  -H 'Content-Type: application/json' \
  -d '{"widget":"wk_...","user_email":"temsilci@firma.com","extension":"1000","page":"webphone"}'

Запит з ключем дистриб'ютора виглядає так:

curl -X POST 'https://api.buluthat.com/api/embed.php?action=session' \
  -H 'X-Bt-Partner-Key: bp_...' -H 'Content-Type: application/json' \
  -d '{"tenant_id":123,"user_email":"temsilci@musteri.com","page":"live_monitor"}'

Якщо користувача не вказано, використовується користувач без входу з коду вбудовування, якщо його немає, використовується представник клієнта.

Відповідь:

{ "ok": true, "url": "https://api.buluthat.com/embed.php?w=wk_...&sso=...", "expires_in": 120, "user": "temsilci@firma.com" }

Приклад PHP:

$ch = curl_init('https://api.buluthat.com/api/embed.php?action=session');
curl_setopt_array($ch, [
    CURLOPT_POST => true,
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => ['Authorization: Bearer ' . getenv('BULUTHAT_KEY'), 'Content-Type: application/json'],
    CURLOPT_POSTFIELDS => json_encode(['widget' => 'wk_...', 'user_email' => $kullanici['email'], 'page' => 'live_monitor']),
]);
$cevap = json_decode(curl_exec($ch), true);
echo '<iframe src="' . htmlspecialchars($cevap['url']) . '" style="width:100%;height:720px;border:0" allow="microphone"></iframe>';

Інші кінцеві точки:

• GET ?action=widgets: перераховує коди вкладання. З ключем дистриб'ютора tenant_id потрібно.
• GET ?action=ping: перевіряє ключ.

c) Безвхідний режим

Вбудований код відкривається без пароля як вибраний користувач. Для цього є дві умови:

• Запит має надходити з дозволеного домену.
• Якщо бажаєте, можна також вимагати, щоб це надходило з вашого списку IP.

Увага: wk_ цей режим має низьку безпеку, оскільки код знаходиться у вихідному коді сторінки. Тільки для екранів у вашій внутрішній мережі, з обмеженими правами персонал використовуйте з обліковим записом.

5. JavaScript API та події

var s = Buluthat.mount('#tel', { key: 'wk_...', page: 'webphone' });

s.dial('05321234567');           // web telefonundan ara
Buluthat.dial('05321234567');    // sayfadaki ilk web telefonundan ara
s.go('report_calls');            // ekran değiştir

s.on('call', function (c) {
  // c.state: idle | ringing | dialing | incall ; c.number: karşı numara
  if (c.state === 'ringing') { musteriKartiniAc(c.number); }
});
s.on('ready', function (d) { /* ekran yüklendi: d.page */ });
s.on('resize', function (d) { /* içerik yüksekliği: d.height */ });

mount варіанти:

Приклад клік-дзвінка (jQuery):

$('.musteri-telefon').on('click', function () { Buluthat.dial($(this).text()); });

Повідомлення приймаються лише з адреси сервера Buluthat. Buluthat також слухає лише команди з ваших дозволених доменів.

6. Записки безпеки

• Сесія вбудовування зберігається в окремому файлі cookie і відкриває лише вибрані екрани. Екрани підписки, оплати, пароля та API-ключа ніколи не відкриваються при вбудовуванні.
• Кожен вхід та зміна коду вбудовування клієнта Історія транзакцій'як написати.'
• Видалення або закриття вбудованого коду миттєво закриває екран на всіх сторінках, що його використовують.
• Не розміщуйте свій API-ключ у коді браузера, мобільному додатку або публічному репозиторії. Деталі: Безпека API.