INTEGRITY Dokumentace

← Cloudflare Stream / stream

WebRTC

Živé vysílání s podsekundovou latencí (pomocí WHIP) a přehrávání (pomocí WHEP) pro neomezený počet souběžných diváků.

WebRTC je ideální, když potřebujete přehrávat živé video téměř v reálném čase, například:

Krok 1: Vytvořte live input

Vytvořte živý vstup pomocí jedné ze dvou možností:

Odpověď API na požadavek POST na /live_inputs
{
  "uid": "1a553f11a88915d093d45eda660d2f8c",
 ...
  "webRTC": {
    "url": "https://customer-<CODE>.cloudflarestream.com/<SECRET>/webRTC/publish"
  },
  "webRTCPlayback": {
    "url": "https://customer-<CODE>.cloudflarestream.com/<INPUT_UID>/webRTC/play"
  },
...
}

Krok 2: Spusťte živé vysílání pomocí WHIP

Každý živý vstup má jedinečnou URL adresu, na kterou může vysílat jeden tvůrce. Tato URL adresa by měla pouze be shared with the creator, anyone with this URL has the ability to stream live video to this live input.

Zkopírujte URL adresu, a to buď z:

Vložte tuto URL adresu do ukázkového kódu.

Zjednodušený ukázkový kód
// Add a <video> element to the HTML page this code runs in:
// <video id="input-video" autoplay muted></video>

import WHIPClient from "./WHIPClient.js";

const url = "<WEBRTC_URL_FROM_YOUR_LIVE_INPUT>"; // add the webRTC URL from your live input here
const videoElement = document.getElementById("input-video");
const client = new WHIPClient(url, videoElement);

Jakmile tvůrce udělí oprávnění ke kameře a mikrofonu, začne se živé video a zvuk automaticky streamovat do Cloudflare pomocí WebRTC.

Tuto adresu URL můžete použít i s libovolným klientem, který podporuje WebRTC-HTTP ingestion protocol (WHIP) ↗. Viz podporovaní klienti WHIP se seznamem klientů, u kterých jsme otestovali a potvrdili kompatibilitu s Cloudflare Stream.

Krok 3: Přehrajte živé video pomocí WHEP

Zkopírujte URL adresu, a to buď z:

Počet souběžně sledujících diváků není nijak omezen.

Vložte tuto URL adresu do ukázkového kódu.

Zjednodušený ukázkový kód
// Add a <video> element to the HTML page this code runs in:
// <video id="output-video" autoplay muted></video>

import WHEPClient from "./WHEPClient.js";

const url = "<WEBRTC_URL_FROM_YOUR_LIVE_INPUT>"; // add the webRTCPlayback URL from your live input here
const videoElement = document.getElementById("output-video");
const client = new WHEPClient(url, videoElement);

Dokud tvůrce aktivně vysílá, diváci by měli vidět jeho vysílání ve svém prohlížeči s latencí kratší než 1 sekunda.

Tuto adresu URL můžete použít i s libovolným klientem, který podporuje WebRTC-HTTP egress protocol (WHEP) ↗. Viz podporovaní klienti WHEP se seznamem klientů, u kterých jsme otestovali a potvrdili kompatibilitu s Cloudflare Stream.

Použití WebRTC v nativních aplikacích

Pokud vytváříte nativní aplikaci, výše uvedený ukázkový kód lze spustit v WkWebView (iOS) ↗, WebView (Android) ↗ nebo pomocí react-native-webrtc ↗. Pokud potřebujete použít WebRTC bez webview, můžete použít nativní knihovny Google pro Javu a Objective-C implementace rozhraní WebRTC API ↗.

Ladění WebRTC

Podporovaní klienti WHIP a WHEP

Kromě ukázkového klienta WHIP a ukázkového klienta WHEP použitých v předchozích příkladech jsme testováním potvrdili kompatibilitu následujících klientů s Cloudflare Stream:

WHIP

WHEP

S přibývajícími klienty WHIP a WHEP se zavazujeme je podporovat a plně dodržovat oba protokoly.

Podporované kodeky

Soulad se specifikacemi WHIP a WHEP

Cloudflare Stream plně podporuje všechny aspekty WHIP ↗ a WHEP ↗ specifikace, včetně:

Konkrétní použitou verzi WHIP a WHEP zjistíte v protocol-version hlavičku v odpovědích WHIP a WHEP API. Hodnota této hlavičky odkazuje na slug návrhu IETF (IETF draft) pro daný protokol. Stream v současnosti používá draft-ietf-wish-whip-06 (očekává se, že půjde o finální revizi návrhu WHIP) a draft-murillo-whep-01 (nejaktuálnější návrh WHEP).

Omezení během beta verze