package.json

О чём урок

Прежде чем писать какой-либо код, вызовите навык /agents, чтобы изучить правильные шаблоны ElevenLabs SDK.

Создайте голосовую демонстрацию, которая взаимодействует с ElevenLabs Realtime через Realtime SDK от OpenAI (@openai/agents-realtime), указывая на совместимую с OpenAI конечную точку ElevenLabs вместо api.openai.com.

• Добавьте зависимости @elevenlabs/elevenlabs-js, @openai/agents-realtime и wavtools.

Общие константы, используемые как маршрутом сервера, так и браузером.

• Экспортируйте REALTIME_URL (wss://api.elevenlabs.io/v1/convai/realtime), REALTIME_MODEL (eleven_realtime_v1_mini), REALTIME_VOICE (brian), AUDIO_SAMPLE_RATE (24000) и короткие инструкции для ассистента.
• Экспортируйте sessionConfig с типом ElevenLabs.OpenAiSessionConfigInput: type: "realtime", модель и инструкции, outputModalities: ["audio"], audio.input с форматом PCM на 24 кГц и обнаружением поворотов semantic_vad, а также audio.output с форматом PCM и голосом.
• Используйте форму сессии GA (outputModalities, вложенные audio.input/audio.output). Не используйте устаревшие поля верхнего уровня modalities или voice.

Защищенная конечная точка GET, которая генерирует кратковременный секрет клиента реального времени. Никогда не раскрывайте ELEVENLABS_API_KEY клиенту.

• Используйте client.conversationalAi.realtime.createClientSecret({ session: sessionConfig, expiresAfter: { anchor: "created_at", seconds: 600 } }).
• Возвращайте в браузер только { value }.
• Возвращайте JSON { error } с соответствующим статусом, если ключ отсутствует или запрос не удался.

Клиентский хук, который управляет сессией реального времени.

• Получите /api/token, затем создайте RealtimeAgent и RealtimeSession с транспортом OpenAIRealtimeWebSocket, используя REALTIME_URL, модель и конфигурацию GA (outputModalities, audio.output.voice). Подключитесь с помощью session.connect({ apiKey: value }).
• SDK подключает аудио только для WebRTC. Захватывайте и воспроизводите PCM16 на 24 кГц с помощью wavtools (WavRecorder, WavStreamPlayer).
• Вызовите player.connect() перед любым другим await в start (включая получение токена), чтобы Safari создал AudioContext для воспроизведения в рамках активации пользователя по клику.
• Непрерывно передавайте аудио с микрофона с помощью session.sendAudio; wavtools типизирует data.mono как Int16Array, но во время выполнения это уже ArrayBuffer, поэтому передавайте его как есть.
• Воспроизводите события audio через add16BitPCM и…

План урока

1. 1. package.json
2. 2. lib/realtime-session.ts
3. 3. app/api/token/route.ts
4. 4. hooks/use-realtime-session.ts
5. 5. app/page.tsx