வெப் விட்ஜெட்டை உட்பொதிக்கவும்

வலை விட்ஜெட், உலாவியின் மைக்ரோஃபோனைப் பயன்படுத்தி, உங்கள் தள பார்வையாளர்களுக்கு AI ஏஜென்டுடன் கிளிக்-செய்து-பேசும் உரையாடலை வழங்குகிறது. இது தனிப்பட்ட SDK குறிப்பு கொண்ட தனி JavaScript / React SDK ஆகும் — இந்த வழிகாட்டி விட்ஜெட்டுக்குத் தேவையான ThunderPhone பக்க அமைப்பில் கவனம் செலுத்துகிறது.

முன்தேவைகள்

1. ஒரு ஏஜென்ட்டை உருவாக்கவும்

   prompt மற்றும் குரல் விட்ஜெட் அமர்வை இயக்கும் ஏஜென்ட். widget_enabled: true (இயல்புநிலை) என அமைக்கவும்.

2. வழிமாற்று பயன்முறையைத் தீர்மானிக்கவும்
   • mode="agent" — ஒவ்வொரு விசைக்கும் ஒரு நிலையான ஏஜென்ட். மிகவும் எளிதானது.
   • mode="webhook" — உங்கள் சர்வர் ஒவ்வொரு பார்வையாளருக்கும் ஏஜென்ட்டைத் தேர்ந்தெடுக்கும் web.incoming webhook மூலம். உள்நுழைந்த பயனர்கள், A/B சோதனைகள் அல்லது பக்கத்திற்கேற்ற வழிமாற்றுக்கு இதைப் பயன்படுத்தவும்.
3. அனுமதிக்கப்பட்ட டொமைன்களைப் பட்டியலிடவும்

   வெளியிடக்கூடிய விசைகள் ஒரிஜின்-பூட்டப்பட்டவை. விட்ஜெட்டை உட்பொதிக்கும் ஒவ்வொரு ஹோஸ்ட்பெயரையும் நீங்கள் குறிப்பிட வேண்டும். உள்ளூர் மேம்பாட்டின்போது localhost / 127.0.0.1 எப்போதும் அனுமதிக்கப்படும்.

வெளியிடக்கூடிய விசையை உருவாக்கவும்

curl -X POST https://api.thunderphone.com/v1/publishable-key \
  -H "Authorization: Bearer sk_live_YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "name":            "Marketing site (prod)",
    "mode":            "agent",
    "agent_id":        12,
    "allowed_domains": ["example.com", "*.example.com"]
  }'

curl -X POST https://api.thunderphone.com/v1/publishable-key \
  -H "Authorization: Bearer sk_live_YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "name":            "Support (dynamic)",
    "mode":            "webhook",
    "webhook_url":     "https://example.com/thunderphone/widget-hook",
    "allowed_domains": ["support.example.com"]
  }'

பதிலில் pk_live_... எனத் தொடங்கும் key அடங்கும். வெளியிடக்கூடிய விசைகள் வடிவமைப்பிலேயே பொதுவானவை — உங்கள் முன்புற தொகுப்பில் அனுப்புவது பாதுகாப்பானது. அனைத்து புலங்களுக்கும் வெளியிடக்கூடிய விசைகள் குறிப்பைப் பார்க்கவும்.

உங்கள் தளத்தில் விட்ஜெட்டைச் சேர்க்கவும்

மூன்று ஒருங்கிணைப்பு விருப்பங்கள் விட்ஜெட் SDK ஆவணங்களில் உள்ளன:

மூன்றும் ஒரே publishableKey-ஐ ஏற்று, மைக் பொத்தானையும் அழைப்பின்போதைய ஆடியோ உறுப்பையும் ரெண்டர் செய்கின்றன.

விட்ஜெட் context 12,000 எழுத்துகளாக வெட்டப்படும் (வழக்கமான ஆங்கில உரையின் தோராயமாக 3,400 டோக்கன்கள்) மற்றும் prompt-அளவு கூடுதல் கட்டணத்தில் கணக்கிடப்படும்.

விட்ஜெட்-பயன்முறை webhooks

mode="webhook" ஆக இருக்கும்போது, ThunderPhone ஒவ்வொரு அமர்வு தொடக்கத்திலும் உங்கள் webhook_url-ஐ web.incoming பேலோடுடன் அழைக்கும். அந்த பார்வையாளருக்காக இயக்க விரும்பும் ஏஜென்ட் அமைப்பைத் திருப்பியனுப்பவும் — இது தொலைபேசி அழைப்புகளுக்கான அதே பதில் ஸ்கீமாவைப் பின்பற்றுகிறது:

{
  "prompt":  "You are a VIP concierge for Jane Doe.",
  "voice":   "john",
  "product": "storm-base",
  "tools":   [ /* per-customer tools */ ]
}

உங்கள் சொந்த அமர்விலிருந்து சூழலை (எந்த வாடிக்கையாளர் உலாவுகிறார், அவர்கள் எந்தப் பக்கத்தில் உள்ளனர்) prompt-இல் சேர்க்கலாம், மேலும் ஒவ்வொரு வெளியீட்டிலும் ஏஜென்ட்களை மாற்றலாம்.

அமர்வுகளைக் கண்காணிக்கவும்

விட்ஜெட் அமர்வுகள் GET /v1/calls-இல் direction="widget" உடன் தோன்றும் — தொலைபேசி அழைப்புகளைப் போலவே அதே டிரான்ஸ்கிரிப்ட், பதிவு, மதிப்பீடு மற்றும் பில்லிங். விட்ஜெட்-மட்டும் டாஷ்போர்டை உருவாக்க direction மூலம் வடிகட்டவும்.

அடுத்த படிகள்