Osadzenie: Umieść centralę w swoim oprogramowaniu

Jeśli masz adres swojego CRM, programu serwisowego lub jakiejkolwiek aplikacji internetowej, możesz otworzyć ekrany centrali i WebPhone w swoim interfejsie. Połączenia na żywo, nagrania rozmów, nagrania audio, przerwy, automatyczne dzwonienie, blokowanie numerów i telefon przeglądarki mogą być osadzone w ten sposób.

Nie wymaga PHP. Działa z czystym HTML, jQuery, React lub dowolnym frameworkiem. Ekrany otwierają się tylko w domenach, które określisz.

Adres bazowy: https://api.buluthat.com

1. Utwórz kod osadzenia

W panelu Operacje subskrypcyjne > Kody osadzenia (CRM) otwórz stronę. Jeśli jesteś dealerem, zrób to w Panelu Dealera > Osadzenie i API na stronie, wybierając klienta.

Twój kod osadzenia wk_ zaczyna się. Ten kod nie jest tajny; jest widoczny w źródle Twojej strony. Pochodzi z listy dozwolonych domen i poniższych metod logowania.

2. Wklej kod na swoją stronę

Jedna linia

<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>

Czysty 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>

W iframe dla WebPhone allow="microphone" jest warunkiem. embed.js to dodaje sam.

3. Ekrany

4. Uwierzytelnianie

a) logowanie w iframe

Jest to domyślna metoda. Użytkownik wpisuje swój e-mail i hasło w ramce przy pierwszym otwarciu; jeśli włączona jest weryfikacja dwuetapowa, również prosi o kod. Sesja jest ważna tylko dla tego osadzonego kodu i wybranych ekranów.

Niektóre przeglądarki (szczególnie Safari) całkowicie blokują pliki cookie z ramki innej witryny. W takim przypadku na ekranie logowania Otwórz w nowym oknie link zostaje usunięty. Użyj podpisanego linku dla trwałego rozwiązania.

b) Podpisany link z serwera (zalecane)

Użytkownik CRM jest już zalogowany w Twoim systemie. Twój serwer jest z Buluthat dla tego użytkownika 2 minut ważne, jednorazowe otrzymuje link logowania i iframe src przypisuje wartość. Użytkownik nie wprowadza również hasła.

Klucz: Na koncie klienta Klucze API strony Osadzenie stwórz kompleksowy klucz. Jeśli jesteś dealerem, przejdź do Panelu Dealera > Osadzenie i API > Klucz API partnera korzystaj; ten klucz jest ważny dla wszystkich klientów związanych z Tobą. Klucz pozostaje tylko na Twoim serwerze, nie trafia do przeglądarki.

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"}'

Żądanie z kluczem partnera jest następujące:

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"}'

Jeśli użytkownik nie jest podany, używany jest użytkownik bez logowania w kodzie osadzenia, a jeśli go nie ma, używany jest przedstawiciel klienta.

Odpowiedź:

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

Przykład 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>';

Inne końcówki:

• GET ?action=widgets: wyświetla kody osadzone. Z kluczem dostawcy tenant_id jest wymagane.
• GET ?action=ping: testuje klucz.

c) Tryb bez logowania

Kod osadzenia otwiera się bez hasła jako wybrany użytkownik. Istnieją dwa warunki:

• Żądanie powinno pochodzić z ramki dozwolonej domeny.
• Można również wymagać, aby pochodziło z Twojej listy IP.

Ostrzeżenie: wk_ ten tryb jest niskiego bezpieczeństwa, ponieważ kod znajduje się w źródle strony. Tylko dla ekranów w Twojej sieci wewnętrznej, z ograniczonymi uprawnieniami personel korzystaj z konta.

5. JavaScript API i zdarzenia

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 opcje:

Przykład kliknij-aby-szukać (jQuery):

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

Wiadomości są akceptowane tylko z adresu serwera Buluthat. Buluthat nasłuchuje tylko poleceń z Twoich dozwolonych domen.

6. Notatki bezpieczeństwa

• Sesja osadzenia jest przechowywana w osobnym ciasteczku i otwiera tylko wybrane ekrany. Ekrany subskrypcji, płatności, hasła i klucza API nigdy nie są osadzane.
• Każde logowanie i zmiana kodu osadzenia są klienta Historia transakcji'ne yazılır.
• Usunięcie lub zamknięcie kodu osadzenia natychmiast zamyka ekran na wszystkich stronach, które go używają.
• Nie umieszczaj swojego klucza API w kodzie przeglądarki, aplikacji mobilnej ani w publicznym repozytorium. Szczegóły: Bezpieczeństwo API.