OpenAI Realtime for Bubble — Quickstart

Overview

This plugin provides a Bubble visual element (Realtime Call) and a server action (Create Ephemeral Realtime Token) to start a secure WebRTC session with OpenAI Realtime models.

1) Plugin Keys

In your Bubble app's Plugins tab, set the openai API key:

• OPENAI_API_KEY — Private

2) Setup (Quick)

1. Realtime Call Drop the element on your page. Must be visible.
2. Add a Start button workflow:
   • Step 1: Plugins → Create Ephemeral Realtime Token (set model, voice, optional instructions)
   • Step 2: Element actions → Realtime Call → start
   • Pass: token/model/voice from Step 1's result
3. Add a Stop button → Realtime Call → stop

3) Start / Stop Actions

Start

Element actions → Realtime Call → start
Inputs:
- token (Text, required)
- model (Text, required; e.g. gpt-4o-realtime-preview)
- voice (Text, required; e.g. verse)

Stop

Element actions → Realtime Call → stop
Ends the call and releases mic + connection.

4) Saving Transcripts

You can capture live transcripts and save them to your Bubble database. Use the "Assistant Done talking"events to save data each time an assistant is done talking.

5) Troubleshooting

• No mic prompt / nothing happens: Ensure Step 2 calls the element's start action, token is passed from Step 1, run on HTTPS, start from a button click.
• 401/403 on SDP exchange: Token expired or model mismatch. Mint in Step 1 and call start immediately; pass model/voice through.
• context.request is not a function: Use fetch in server action.
• "Expected a string, but got a number": Bubble return types must be text; String() everything (already handled in server action sample).
• Connected but no audio: Corporate network may block UDP. Try another network or add TURN later.

6) FAQ