setting up the public stun server

examples/voice_agent_webrtc_langgraph/pipeline.py

@@ -452,6 +452,30 @@ if UI_DIST_DIR.exists():
     app.mount("/", StaticFiles(directory=str(UI_DIST_DIR), html=True), name="static")
 
 
+@app.get("/rtc-config")
+async def rtc_config():
+    """Expose browser RTC ICE configuration based on environment variables.
+
+    Reads TURN_SERVER_URL, TURN_USERNAME, TURN_PASSWORD and returns a structure
+    consumable by the browser: { "iceServers": [ { urls, username?, credential? } ] }.
+    Always includes a public STUN as a fallback.
+    """
+    ice_servers: list[dict] = []
+    turn_url = os.getenv("TURN_SERVER_URL") or os.getenv("TURN_URL")
+    turn_user = os.getenv("TURN_USERNAME") or os.getenv("TURN_USER")
+    turn_pass = os.getenv("TURN_PASSWORD") or os.getenv("TURN_PASS")
+    if turn_url:
+        server: dict = {"urls": turn_url}
+        if turn_user:
+            server["username"] = turn_user
+        if turn_pass:
+            server["credential"] = turn_pass
+        ice_servers.append(server)
+    # Public STUN fallback to aid connectivity when TURN is not provided
+    ice_servers.append({"urls": "stun:stun.l.google.com:19302"})
+    return {"iceServers": ice_servers}
+
+
 if __name__ == "__main__":
     parser = argparse.ArgumentParser(description="WebRTC demo")
     parser.add_argument("--host", default="0.0.0.0", help="Host for HTTP server (default: localhost)")

examples/voice_agent_webrtc_langgraph/ui/src/App.tsx

@@ -6,7 +6,7 @@ import { useEffect, useState } from "react";
 import { AudioStream } from "./AudioStream";
 import { AudioWaveForm } from "./AudioWaveForm";
 import { Toaster } from "./components/ui/sonner";
-import { RTC_CONFIG, RTC_OFFER_URL, DYNAMIC_PROMPT, POLL_PROMPT_URL, ASSISTANTS_URL } from "./config";
+import { RTC_OFFER_URL, DYNAMIC_PROMPT, POLL_PROMPT_URL, ASSISTANTS_URL } from "./config";
 import usePipecatWebRTC from "./hooks/use-pipecat-webrtc";
 import { Transcripts } from "./Transcripts";
 import WebRTCButton from "./WebRTCButton";
@@ -19,10 +19,11 @@ function App() {
   const [assistants, setAssistants] = useState<Array<{ assistant_id: string; name?: string | null; graph_id?: string | null; display_name?: string | null }>>([]);
   const [selectedAssistant, setSelectedAssistant] = useState<string | null>(null);
   const [selectedAssistantName, setSelectedAssistantName] = useState<string>("Speech to Speech Demo");
+  const [rtcConfig, setRtcConfig] = useState<ConstructorParameters<typeof RTCPeerConnection>[0]>({});
   
   const webRTC = usePipecatWebRTC({
     url: RTC_OFFER_URL,
-    rtcConfig: RTC_CONFIG,
+    rtcConfig,
     onError: (e) => toast.error(e.message),
     assistant: selectedAssistant,
   });
@@ -77,6 +78,23 @@ function App() {
     fetchAssistants();
   }, []);
 
+  // Fetch ICE configuration for RTC
+  useEffect(() => {
+    const fetchRtcConfig = async () => {
+      try {
+        const res = await fetch("/rtc-config");
+        if (!res.ok) throw new Error(`HTTP ${res.status}`);
+        const data = await res.json();
+        setRtcConfig(data || {});
+      } catch (e) {
+        console.warn("Failed to fetch rtc-config", e);
+        // Fallback STUN if server not available
+        setRtcConfig({ iceServers: [{ urls: "stun:stun.l.google.com:19302" }] });
+      }
+    };
+    fetchRtcConfig();
+  }, []);
+
   // Send current prompt IMMEDIATELY when WebRTC connection is established
   useEffect(() => {
     if (webRTC.status === "connected" && currentPrompt.trim()) {