WebRTC Technical Deep-Dive

// 1. Create peer connection with Cloudflare ICE servers
const pc = new RTCPeerConnection({
  iceServers: [
    { urls: 'stun:stun.cloudflare.com:3478' },
    {
      urls: 'turn:turn.cloudflare.com:3478',
      username: 'cloudflare',
      credential: 'credentials-from-api'
    }
  ]
});

// 2. Add local media tracks
const stream = await navigator.mediaDevices.getUserMedia({
  video: { width: 1920, height: 1080 },
  audio: true
});

stream.getTracks().forEach(track => pc.addTrack(track, stream));

// 3. Create SDP offer
const offer = await pc.createOffer();
await pc.setLocalDescription(offer);

// 4. Send offer to WAVE WHIP endpoint
const response = await fetch('https://rtc.wave.inc/whip/stream_xyz', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer wave_live_xxxxx',
    'Content-Type': 'application/sdp'
  },
  body: offer.sdp
});

// 5. Receive SDP answer
const answer = await response.text();
await pc.setRemoteDescription({ type: 'answer', sdp: answer });

// 6. ICE candidates exchange automatically
// Cloudflare Calls handles STUN/TURN negotiation

console.log('Publishing started! Latency: <200ms encoder-to-edge');