Загрузка…
Загрузка…
Perfect Negotiation: RTCPeerConnection, ICE servers, signaling for SDP/candidates, DataChannel for reliable chat.
// The Perfect Negotiation shape — offer/answer over YOUR signaling channel.
const pc = new RTCPeerConnection({
iceServers: [
{ urls: 'stun:stun.l.google.com:19302' }, // find public address
{ urls: 'turn:turn.example.com', username: 'u', credential: 'p' }, // relay fallback
],
});
// 1. Send our ICE candidates to the other peer as they're discovered.
pc.onicecandidate = ({ candidate }) => candidate && signal.send({ candidate });
// 2. A reliable data channel (no server on the hot path).
const chan = pc.createDataChannel('chat');
chan.onmessage = (e) => render(e.data);
// 3. Caller creates the offer; callee answers. Both go over signaling.
const offer = await pc.createOffer();
await pc.setLocalDescription(offer);
signal.send({ sdp: pc.localDescription });
// 4. On the other side, on receiving the offer:
async function onSignal({ sdp, candidate }) {
if (sdp) {
await pc.setRemoteDescription(sdp);
if (sdp.type === 'offer') {
await pc.setLocalDescription(await pc.createAnswer());
signal.send({ sdp: pc.localDescription });
}
} else if (candidate) {
await pc.addIceCandidate(candidate); // may arrive before/after the SDP
}
}Signaling channel + STUN/TURN config + offer/answer flow — minimum viable WebRTC integration.
