Fix openai demo (#279)

This commit is contained in:
Freddy Boulton
2025-04-15 09:42:22 -04:00
committed by GitHub
parent 54d07bc3c8
commit d710c06210
2 changed files with 32 additions and 9 deletions

View File

@@ -50,15 +50,32 @@ class OpenAIHandler(AsyncStreamHandler):
model="gpt-4o-mini-realtime-preview-2024-12-17" model="gpt-4o-mini-realtime-preview-2024-12-17"
) as conn: ) as conn:
await conn.session.update( await conn.session.update(
session={"turn_detection": {"type": "server_vad"}} session={
"turn_detection": {"type": "server_vad"},
"input_audio_transcription": {
"model": "whisper-1",
"language": "en",
},
}
) )
self.connection = conn self.connection = conn
async for event in self.connection: async for event in self.connection:
# Handle interruptions # Handle interruptions
if event.type == "input_audio_buffer.speech_started": if event.type == "input_audio_buffer.speech_started":
self.clear_queue() self.clear_queue()
if (
event.type
== "conversation.item.input_audio_transcription.completed"
):
await self.output_queue.put(
AdditionalOutputs({"role": "user", "content": event.transcript})
)
if event.type == "response.audio_transcript.done": if event.type == "response.audio_transcript.done":
await self.output_queue.put(AdditionalOutputs(event)) await self.output_queue.put(
AdditionalOutputs(
{"role": "assistant", "content": event.transcript}
)
)
if event.type == "response.audio.delta": if event.type == "response.audio.delta":
await self.output_queue.put( await self.output_queue.put(
( (
@@ -124,7 +141,7 @@ def _(webrtc_id: str):
import json import json
async for output in stream.output_stream(webrtc_id): async for output in stream.output_stream(webrtc_id):
s = json.dumps({"role": "assistant", "content": output.args[0].transcript}) s = json.dumps(output.args[0])
yield f"event: output\ndata: {s}\n\n" yield f"event: output\ndata: {s}\n\n"
return StreamingResponse(output_stream(), media_type="text/event-stream") return StreamingResponse(output_stream(), media_type="text/event-stream")

View File

@@ -45,20 +45,26 @@
.message { .message {
margin-bottom: 20px; margin-bottom: 20px;
padding: 12px; padding: 12px 16px;
border-radius: 4px; border-radius: 8px;
font-size: 16px; font-size: 16px;
line-height: 1.5; line-height: 1.5;
max-width: 70%;
clear: both;
} }
.message.user { .message.user {
background-color: #1a1a1a; background-color: #2c2c2c;
margin-left: 20%; float: right;
border-bottom-right-radius: 2px;
border: 1px solid #404040;
} }
.message.assistant { .message.assistant {
background-color: #262626; background-color: #262626;
margin-right: 20%; float: left;
border-bottom-left-radius: 2px;
border: 1px solid #333;
} }
.controls { .controls {
@@ -435,7 +441,7 @@
const eventSource = new EventSource('/outputs?webrtc_id=' + webrtc_id); const eventSource = new EventSource('/outputs?webrtc_id=' + webrtc_id);
eventSource.addEventListener("output", (event) => { eventSource.addEventListener("output", (event) => {
const eventJson = JSON.parse(event.data); const eventJson = JSON.parse(event.data);
addMessage("assistant", eventJson.content); addMessage(eventJson.role, eventJson.content);
}); });
} catch (err) { } catch (err) {