Realtime Voice Agent

\n Creates a WebRTC RTCPeerConnection and posts a WHIP offer\n to /start.\n

\n\n

\n \n \n

\n\n

Status

idle

Local Mic

—

ICE

—

Conn

—

Server

POST /start

\n\n

\n If audio is muted by the browser, click anywhere on the page to allow\n playback.\n

\n\n \n Logs\n \n

\n\n \n \n","deleted","label","children",[],[158],{"_104":178,"_95":179,"_159":180,"_161":-5,"_162":140,"_163":181,"_165":22,"_106":182,"_100":183,"_168":184,"_170":185,"_172":22,"_173":96,"_174":186,"_98":187},"c77e0b4a-7a52-11f0-83dc-0224a6c84d84","main.tsx","0198a962-fcd3-77e8-9abe-4d2fa0914f2f",56,["D",1755315640119],27,"http","import { Hono } from \"npm:hono\";\nimport {\n readFile,\n serveFile,\n} from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport rtc from \"./rtc.ts\";\nimport sip from \"./sip.ts\";\nimport observer from \"./observer.ts\";\n\nconst app = new Hono();\napp.route(\"/rtc\", rtc);\napp.route(\"/sip\", sip);\napp.route(\"/observer\", observer);\n\napp.get(\"/\", async (c) => {\n const html = await readFile(\"/index.html\", import.meta.url);\n return c.html(html);\n});\n\nexport default app.fetch;",[],[179],{"_104":189,"_95":190,"_159":191,"_161":-5,"_162":140,"_163":192,"_165":22,"_106":193,"_100":194,"_168":195,"_170":196,"_172":22,"_173":-5,"_174":197,"_98":198},"edfdb2d4-7a52-11f0-9b45-0224a6c84d84","observer.ts","4ee97b48-7a42-11f0-bd89-0224a6c84d84",58,["D",1755315704710],4,"script","import { Hono } from \"npm:hono\";\nimport WebSocket from \"npm:ws\";\nimport { makeHeaders } from \"./utils.ts\";\n\nconst observer = new Hono();\n\n// POST /observer/:callId : self-connect to establish a web socket\nobserver.post(\"/:callId\", async (c) => {\n const callId = c.req.param(\"callId\");\n const url = `wss://api.openai.com/v1/realtime?call_id=${callId}`;\n const ws = new WebSocket(url, { headers: makeHeaders() });\n ws.on(\"open\", () => {\n console.log(\"✅ websocket connected\");\n ws.send(JSON.stringify({ type: \"response.create\" }));\n });\n ws.on(\"message\", (data /*, isBinary */) => {\n const message = JSON.parse(data);\n if (message.type !== \"response.audio_transcript.delta\") {\n console.log(message);\n }\n });\n ws.on(\"error\", (err: Error) => {\n console.error(`🔴 websocket failed: ${err.message}`);\n });\n\n // Respond immediately; WS continues in background\n return c.newResponse(null, { status: 200 });\n});\n\nexport default observer;",[],[190],{"_104":200,"_95":201,"_159":202,"_161":-5,"_162":140,"_163":203,"_165":22,"_106":204,"_100":167,"_168":195,"_170":205,"_172":22,"_173":-5,"_174":206,"_98":207},"7b1e3aee-7a53-11f0-83dc-0224a6c84d84","rtc.ts","4062ea64-7a42-11f0-a266-0224a6c84d84",63,["D",1755315941481],"import { Hono } from \"npm:hono\";\nimport { makeHeaders, makeSession } from \"./utils.ts\";\n\nconst rtc = new Hono();\n\n// POST /rtc : create a new call\nrtc.post(\"/\", async (c) => {\n // Create the call.\n const url = \"https://api.openai.com/v1/realtime/calls\";\n const headers = makeHeaders();\n const fd = new FormData();\n fd.set(\"sdp\", await c.req.text());\n fd.set(\"session\", JSON.stringify(makeSession());\n const opts = { method: \"POST\", headers, body: fd };\n const resp = await fetch(url, opts);\n if (!resp.ok) {\n const errText = await resp.text().catch(() => \"\");\n console.error(`🔴 start call failed: ${resp.status} ${errText}`);\n return c.text(\"Internal error\", 500);\n }\n\n const contentType = resp.headers.get(\"Content-Type\");\n const location = resp.headers.get(\"Location\");\n const callId = location?.split(\"/\").pop();\n console.log(\"✅ call created:\", callId);\n\n // Kick off observer in the background (fire-and-forget).\n const selfUrl = new URL(c.req.url);\n fetch(`${selfUrl.origin}/observer/${callId}`, { method: \"POST\" });\n\n return c.newResponse(resp.body, {\n headers: { \"Content-Type\": contentType },\n });\n});\n\nexport default rtc;",[],[201],{"_104":209,"_95":99,"_159":210,"_161":-5,"_162":140,"_163":101,"_165":22,"_106":211,"_100":212,"_168":195,"_170":213,"_172":22,"_173":-5,"_174":214,"_98":215},"90bfb828-7a53-11f0-ba1b-0224a6c84d84","6676d24c-7a42-11f0-ab3b-0224a6c84d84",["D",1755315977772],10,"import { Hono } from \"npm:hono\";\nimport { Webhook } from \"npm:svix\";\nimport { makeHeaders, makeSession } from \"./utils.ts\";\n\nconst OPENAI_SIGNING_SECRET = Deno.env.get(\"OPENAI_SIGNING_SECRET\");\nif (!OPENAI_SIGNING_SECRET) {\n console.log(\"⚠️ webhook secret not configured\");\n}\n\nconst sip = new Hono();\n\n// POST /sip : webhook endpoint\nsip.post(\"/\", async (c) => {\n // Verify the webhook.\n const webhook = new Webhook(OPENAI_SIGNING_SECRET);\n const bodyStr = await c.req.text();\n let callId: string | undefined;\n try {\n const headers = Object.fromEntries(c.req.raw.headers.entries());\n const payload: any = webhook.verify(bodyStr, headers);\n callId = payload.data.call_id;\n console.log(\"✅ verified webhook:\", callId);\n } catch (error) {\n console.error(`🔴 verify failed: ${error}`);\n return c.text(\"Invalid signature\", 401);\n }\n\n // Accept the call.\n const url = `https://api.openai.com/v1/realtime/calls/${callId}/accept`;\n const headers = makeHeaders(\"application/json\");\n const body = JSON.stringify(makeSession());\n const opts = { method: \"POST\", headers, body };\n const resp = await fetch(url, opts);\n if (!resp.ok) {\n const errText = await resp.text().catch(() => \"\");\n console.error(`🔴 accept failed: ${errText}`);\n return c.text(\"Internal error\", 500);\n }\n console.log(\"✅ call accepted:\", callId);\n\n // Kick off observer in the background (fire-and-forget).\n const selfUrl = new URL(c.req.url);\n fetch(`${selfUrl.origin}/observer/${callId}`, { method: \"POST\" })\n .catch((e) => console.error(\"observer trigger failed:\", e));\n\n return c.newResponse(null);\n});\n\nexport default sip;",[],[99],{"_104":217,"_95":218,"_159":219,"_161":-5,"_162":140,"_163":220,"_165":22,"_106":221,"_100":222,"_168":195,"_170":223,"_172":22,"_173":-5,"_174":224,"_98":225},"c0d4d652-7a52-11f0-ba1b-0224a6c84d84","utils.ts","acbfe6e4-7a42-11f0-80cf-0224a6c84d84",53,["D",1755315628944],5,"const OPENAI_API_KEY = Deno.env.get(\"OPENAI_API_KEY\");\nif (!OPENAI_API_KEY) {\n throw new Error(\"🔴 OpenAI API key not configured\");\n}\n\nexport function makeHeaders(contentType?: string) {\n const obj: Record = {\n Authorization: `Bearer ${OPENAI_API_KEY}`,\n };\n if (contentType) obj[\"Content-Type\"] = contentType;\n return obj;\n}\n\nexport function makeSession() {\n return {\n model: \"gpt-4o-realtime-preview-2025-06-03\",\n instructions: \"Greet the user with 'Hello World!'\",\n };\n}",[],[218],"files",[156,177,188,199,208,216],"counts",{"_230":32,"_231":232,"_233":234,"_235":232},"pulls","branches",2,"forks",19,"envVars","contents",[],{"_104":209,"_95":99,"_159":210,"_161":-5,"_162":140,"_163":101,"_165":22,"_106":239,"_100":212,"_168":195,"_170":213,"_172":22,"_173":-5,"_98":240},["D",1755315977772],[99],"upstreamProject","upstreamBranch",{"_104":143,"_106":244,"_245":246,"_95":43,"_141":149,"_100":247,"_142":-5,"_144":-5,"_248":249,"_108":-5,"_153":22,"_110":147,"_152":94,"_16":121,"_151":250},["D",1749143813271],"updatedAt",["D",1755305179327],55,"lockfileKey","1755305180007-esm.town_v_jubertioai_hello-sip@55-main","hello-sip","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_93":94,"_95":96,"_97":43,"_100":101,"_98":99,"_102":257,"_154":262,"_226":281,"_169":282,"_236":285,"_286":287,"_290":291,"_292":-5,"_293":294,"_295":296,"_297":298},{"_104":105,"_95":96,"_106":258,"_108":-5,"_109":22,"_110":111,"_112":113,"_114":-5,"_14":115,"_116":-5,"_117":22,"_118":-5,"_119":120,"_16":121,"_122":123,"_124":123,"_125":126,"_127":126,"_128":126,"_129":123,"_130":123,"_23":259,"_134":260,"_137":261,"_153":22},["D",1755188493466],{"_93":94,"_132":133},{"_93":94,"_136":133},{"_100":139,"_95":43,"_104":140,"_141":105,"_142":143,"_144":145,"_146":147,"_148":149,"_150":121,"_151":96,"_152":94},[263,266,269,272,275,278],{"_104":157,"_95":158,"_159":160,"_161":-5,"_162":140,"_163":164,"_165":22,"_106":166,"_100":167,"_168":169,"_170":171,"_172":22,"_173":-5,"_174":264,"_98":265},[],[158],{"_104":178,"_95":179,"_159":180,"_161":-5,"_162":140,"_163":181,"_165":22,"_106":182,"_100":183,"_168":184,"_170":185,"_172":22,"_173":96,"_174":267,"_98":268},[],[179],{"_104":189,"_95":190,"_159":191,"_161":-5,"_162":140,"_163":192,"_165":22,"_106":193,"_100":194,"_168":195,"_170":196,"_172":22,"_173":-5,"_174":270,"_98":271},[],[190],{"_104":200,"_95":201,"_159":202,"_161":-5,"_162":140,"_163":203,"_165":22,"_106":204,"_100":167,"_168":195,"_170":205,"_172":22,"_173":-5,"_174":273,"_98":274},[],[201],{"_104":209,"_95":99,"_159":210,"_161":-5,"_162":140,"_163":101,"_165":22,"_106":211,"_100":212,"_168":195,"_170":213,"_172":22,"_173":-5,"_174":276,"_98":277},[],[99],{"_104":217,"_95":218,"_159":219,"_161":-5,"_162":140,"_163":220,"_165":22,"_106":221,"_100":222,"_168":195,"_170":223,"_172":22,"_173":-5,"_174":279,"_98":280},[],[218],[263,266,269,272,275,278],{"_104":209,"_162":140,"_159":210,"_95":99,"_170":213,"_168":195,"_100":212,"_161":-5,"_106":283,"_163":101,"_173":-5,"_98":284},["D",1755315977772],[99],[],"upstream",{"_104":143,"_106":288,"_245":289,"_95":43,"_141":149,"_100":247,"_142":-5,"_144":-5,"_248":249,"_108":-5,"_153":22,"_110":147,"_152":94,"_16":121,"_151":250},["D",1749143813271],["D",1755305179327],"showCompareCallout",true,"pull","ahead",296,"behind",8,"templates",[],"actionData","errors"]