本文へ移動

ElevenLabs + Kasamila：音声と映像を同じ経路で扱うビデオ客服

既存の ElevenLabs Agent を維持し、返答に見えるアバターを追加。再生と口の動きは同じ音声を使います。

既存の ElevenLabs Agent を維持し、返答に見えるアバターを追加。再生と口の動きは同じ音声を使います。

実装手順

  1. 既存 Agent の知識ベース、客服指示、許可されたツール、人への引き継ぎを設定します。アバターは業務ロジックを置き換えません。
  1. npm ci を実行し .env.example を .env にコピー。PROVIDER=elevenlabs、ELEVENLABS_API_KEY、ELEVENLABS_AGENT_ID、Kasamila 設定と一致する媒体記述子をサーバーだけに設定し、入出力は PCM にします。
  1. npm start 後 /public/video-call.html を開き、Start で音声とマイクを許可。サーバーが署名付き ElevenLabs URL を取得し、その URL と永久キーをブラウザへ渡しません。
  1. マイクは Agent だけに送信。返答の実際の PCM を同じ Kasamila SDK で再生し口を動かし、別プレイヤーは使いません。任意のカメラはローカル表示のみ。人同士の WebRTC 通話や PSTN の完成サービスではありません。
  1. 話し始めると古い再生を破棄します。手動キュー消去だけでは上流生成の停止を保証しません。End で接続を閉じ、アバターを destroy し認可済み Runtime 終了を要求。無音は課金停止ではなく、終了確認が必要です。
cd examples/realtime-integrations
npm ci
cp .env.example .env
# Backend-only configuration: see linked guide
npm start

範囲と検証

実行可能な例であり、プロバイダー認証や音素精度の保証ではありません。ログイン、権限、同意、HTTPS/WSS を追加し、実アカウントで会話と割り込みを確認してください。

コードとプロトコル

Markdown / AI 閲覧

zh | en | fr | de | ru | es | it | ar | ja | ko | th | ms | vi | hi | id