Transmitir en vivo desde el navegador

​

Flujo

1. Crea un flujo a través de la API y obtén una clave de transmisión.
2. Abra una conexión WebRTC para Livepeer ingest usando esa clave (se requiere STUN/TURN).
3. Capture la cámara, el micrófono y/o la pantalla en el navegador y envíela a través de WebRTC.
4. Los espectadores ven a través de la transmisión ID de reproducción en la Livepeer Jugador.

​

Usar el componente Broadcast

import * as Broadcast from "@livepeer/react/broadcast";
import { getIngest } from "@livepeer/react/external";

const streamKey = "your-stream-key";

export function DemoBroadcast() {
  return (
    <Broadcast.Root ingestUrl={getIngest(streamKey)}>
      <Broadcast.Container>
        <Broadcast.Video title="Live stream" />
        <Broadcast.Controls>
          <Broadcast.EnabledTrigger />
        </Broadcast.Controls>
      </Broadcast.Container>
    </Broadcast.Root>
  );
}

​

Transmisión integrable

<iframe
  src="https://lvpr.tv/broadcast/STREAM_KEY"
  allow="autoplay; camera; microphone; display-capture"
  frameborder="0"
></iframe>

​

WebRTC personalizado (WHIP)

1. Enviar “HEAD a “https://livepeer.studio/webrtc/{STREAM_KEY} y siga las Location redirección para la URL de ingestión.
2. Crear RTCPeerConnection con servidores ICE de ese host (STUN/TURN).
3. Crear oferta SDP, reunir ICE, enviar la oferta a la URL de ingestión y establecer la respuesta como descripción remota.
4. Agregar pistas de medios y enviar. El final de la transmisión se detecta cuando los paquetes dejan de llegar; no se requiere DELETE.