Utwórz widżet internetowy w panelu

Skonfiguruj widżet „kliknij, aby rozmawiać” dla swojej witryny na stronie Widżety internetowe — bez wywołań API.

Strona Widżety internetowe (/dashboard/web-widgets) tworzy i zarządza kluczami publicznymi, które obsługują osadzany widżet głosowy ThunderPhone. Wszystko, co wersja API tego przewodnika robi za pomocą cURL, ta strona robi za pomocą formularza — dodatkowo generuje dla Ciebie kod do osadzenia.

Utwórz widżet#

1. Kliknij Nowy widżet i wybierz tryb
   • Tryb agenta — widżet zawsze uruchamia jednego agenta głosowego wybranego z listy rozwijanej. Najprostsza konfiguracja.
   • Tryb webhooka — przy każdej sesji widżetu ThunderPhone wywołuje adres URL webhooka, a serwer zwraca konfigurację agenta dla danego odwiedzającego (routing według strony, zalogowani użytkownicy, wdrożenia). Pozostaw adres URL pusty, aby użyć domyślnego webhooka organizacji; po wprowadzeniu nowego adresu URL możesz także ustawić go jako domyślny dla organizacji.
2. Wymień dozwolone domeny

   Wymagana jest co najmniej jedna domena, a przeglądarki mogą rozpoczynać sesje wyłącznie z wymienionych nazw hostów. Dozwolone są symbole wieloznaczne dla subdomen, takie jak *.example.com (dopasowują subdomeny, ale nie samą domenę); ogólne symbole wieloznaczne, takie jak *, są odrzucane. Lista zapobiega przypadkowemu ponownemu użyciu klucza w innych witrynach, ale nie stanowi uwierzytelniania: skrypt poza przeglądarką może wysłać dowolny nagłówek Origin. localhost nie jest automatycznie dozwolony w środowisku produkcyjnym; dodaj go do listy, aby testować lokalnie z użyciem produkcyjnego API.

3. Wybierz nadpisania z przeglądarki

   Zaznacz każde ustawienie sesji wysyłane przez stronę: Kontekst strony, Zmienne, Głos, Język. Nowe widżety nie akceptują żadnego z nich, a żądanie sesji zawierające wyłączone ustawienie kończy się błędem 400. Klucz jest publiczny, więc zezwalaj tylko na to, czego używasz. Zobacz Nadpisania z przeglądarki.

4. Nadaj nazwę, włącz i utwórz

   Przełącznik Włącz widżet kontroluje, czy klucz akceptuje sesje — możesz utworzyć wyłączony widżet i włączyć go przy uruchomieniu.

Pobierz kod do osadzenia#

Bezpośrednio po utworzeniu (lub za pomocą przycisku Osadź w każdym wierszu) okno osadzania generuje gotowy do wklejenia kod z uzupełnionym kluczem publicznym:

• React — fragment <ThunderPhoneWidget /> dla aplikacji używających bundlera.
• Tag skryptu — para CDN <script> + arkusz stylów dla dowolnej witryny.

Okno wyświetla również podgląd podstawowych opcji wyglądu — tytułu, koloru podstawowego, położenia w rogu i jasnego/ciemnego motywu — oraz uwzględnia Twoje wybory we fragmencie kodu. Pełny opis właściwości, punkty rozszerzeń stylizacji oraz opcję headless znajdziesz w dokumentacji SDK widżetu.

Zarządzaj widżetami z listy#

Każdy wiersz można edytować na miejscu:

• Tryb / Agent — przełączaj między trybem agenta i webhooka lub zmieniaj agenta za pomocą selektorów wbudowanych w wiersz.
• Domeny — dodawaj lub usuwaj dozwolone domeny jako etykiety.
• Włącz/wyłącz — przełącznik dla każdego widżetu; wyłączone widżety natychmiast przestają akceptować sesje.
• Przenieś do organizacji — skopiuj lub przenieś widżet do innej organizacji, do której należysz (przeniesienie usuwa go tutaj).
• Usuń — unieważnia klucz publiczny; widżet natychmiast przestaje działać we wszystkich domenach. Tej operacji nie można cofnąć.

Sesje widżetu pojawiają się w historii połączeń z takim samym transkryptem, nagraniem i oceną jak połączenia telefoniczne.

Dalsze kroki#