Skip to main content
רכיב האינטרנט מאפשר למבקרים באתר שלכם לנהל שיחה בלחיצה כדי לדבר עם סוכן בינה מלאכותית, באמצעות המיקרופון של הדפדפן. זוהי ערכת SDK נפרדת ל-JavaScript / React עם תיעוד SDK משלה — מדריך זה מתמקד בהגדרה בצד ThunderPhone שנדרשת עבור הרכיב.
תוכלו לבצע את כל הפעולות האלה ללא cURL: דף רכיבי האינטרנט בלוח הבקרה (/dashboard/web-widgets) יוצר את הרכיב, מגדיר את המצב ואת הסוכן שלו, מנהל דומיינים מורשים ומספק לכם את קטע ההטמעה.

דרישות מוקדמות

1

צרו סוכן

הסוכן שההנחיה והקול שלו יפעילו את הפעלת הרכיב. הגדירו את widget_enabled: true (ברירת המחדל).
2

החליטו על מצב הניתוב

  • mode="agent" — סוכן סטטי אחד לכל מפתח. האפשרות הפשוטה ביותר.
  • mode="webhook" — השרת שלכם בוחר את הסוכן לכל מבקר באמצעות וובהוק web.incoming. השתמשו בכך עבור משתמשים מחוברים, בדיקות A/B או ניתוב לפי עמוד.
3

פרטו את הדומיינים המורשים

מפתחות הניתנים לפרסום נעולים למקור. עליכם לציין כל שם מארח שיטמיע את הרכיב. localhost / 127.0.0.1 מורשים תמיד במהלך פיתוח מקומי.

צרו מפתח ניתן לפרסום

התגובה כוללת key שמתחיל ב-pk_live_.... מפתחות הניתנים לפרסום הם ציבוריים בכוונה תחילה — בטוח לכלול אותם בחבילת החזית שלכם. ראו את תיעוד המפתחות הניתנים לפרסום עבור כל השדות.
allowed_domains חייב להכיל לפחות רשומה אחת. *.example.com תואם תת-דומיינים (לדוגמה, api.example.com) אך לא את הדומיין ללא תת-דומיין. תווים כלליים ללא דומיין כגון * או *.* נדחים.

הטמיעו את הרכיב באתר שלכם

שלוש אפשרויות אינטגרציה מתוארות ב- תיעוד SDK של הרכיב:

רכיב React

<ThunderPhoneWidget publishableKey="pk_live_..." />.

הוק ללא ממשק

useThunderPhone() עבור ממשקי משתמש מותאמים אישית.

תגית סקריפט CDN

ThunderPhone.mount({...}) עבור אתרים שאינם משתמשים בכלי איגוד.
כל שלוש האפשרויות מקבלות את אותו publishableKey ומציגות את כפתור המיקרופון ואת רכיב השמע במהלך השיחה. ה-context של הרכיב נחתך ל-12,000 תווים (כ-3,400 טוקנים של טקסט אנגלי טיפוסי) ונכלל בחישוב תוספת התשלום עבור גודל ההנחיה.

וובהוקים במצב רכיב

כאשר mode="webhook", ThunderPhone פונה אל webhook_url שלכם בכל תחילת הפעלה עם מטען web.incoming. החזירו את תצורת הסוכן שברצונכם להפעיל עבור אותו מבקר — היא פועלת לפי אותה סכמת תגובה כמו בשיחות טלפון:
תוכלו לשלב בהנחיה הקשר מההפעלה שלכם (איזה לקוח גולש, באיזה עמוד הוא נמצא) ולהחליף סוכנים בכל פריסה.

עקבו אחר ההפעלות

הפעלות הווידג’ט מופיעות ב- GET /v1/calls עם direction="widget" — עם אותו תמלול, הקלטה, דירוג וחיוב כמו שיחות טלפון. סננו לפי direction כדי לבנות לוח בקרה לווידג’ט בלבד.

השלבים הבאים

הפניה ל-SDK של הווידג'ט

פרטי אינטגרציה של React / hook / CDN.

תצורה דינמית לכל שיחה

יישמו את תהליך mode="webhook" מקצה לקצה.

הפניה למפתחות ניתנים לפרסום

כל שדה במשאב המפתח.

API של הפעלות מיקרופון

דלגו על הווידג’ט; הפעילו את LiveKit ישירות עבור ממשקי משתמש מותאמים אישית.