Requisitos • Publicación • Suscripción
Red5 Pro HTML Streaming Testbed
Este repositorio contiene un proyecto simple con una serie de ejemplos que pueden usarse para probar y referencia para el SDK RED5 PRO WEBRTC.
Requisitos
Necesitará un servidor RED5 Pro del servidor RED5 Functual (o localmente) accesible para que el navegador del cliente (Mobile & Desktop) pueda conectarse.
Para obtener más información, visite https://www.red5.net/.
Compabilidad del navegador
El RED5 PRO WEBRTC SDK tiene como objetivo utilizar WEBRTC para su solución de transmisión (publicación y suscripción), pero también proporciona soporte HLS para navegadores que lo admiten de forma nativa (por ejemplo, safari móvil y de escritorio).
Se puede ver más información sobre la compabilidad del navegador en la información de connección de pares de WEBRTC en Caniuse.com.
Editor
El término editor en el contexto de Red5 Pro se refiere a un cliente que produce una transmisión de transmisión. Hay dos tipos de instancias del SDK que se pueden utilizar para iniciar un editor :
-
WHIPClient : el WHIPClient se basa en la protocl de ingestión WebRTC -HTTP para establecer una conexión a través de una serie de solicitudes HTTP/S. -
RTCPublisher : el RTCPublisher se basa en una conexión WebSocket para establecer una sesión de transmisión.
La secuencia de conexión WHEPClient es muy rápida, ~ 1 segundo, mientras que el RTCPublisher , debido a su dependencia de un WebSocket , puede tardar aproximadamente 3 - 5 segundos en una conexión a la transmisión.
Abonado
El término suscriptor en el contexto de Red5 Pro se refiere a un cliente que consume y reproduce una transmisión de transmisión ya en vivo. Hay tres tipos de instancias del SDK que se pueden utilizar para comenzar un suscriptor :
-
WHEPClient : el WHEPClient se basa en el protocolo de salida WEBRTC -HTTP para establecer una conexión a través de una serie de solicitudes HTTP/S. -
RTCSubscriber : el RTCSubscriber se basa en una conexión WebSocket para establecer una sesión de transmisión. -
HLSSubscriber : el HLSSubscriber se basa en la capacidad nativa de reproducir transmisiones HLS (por ejemplo, Safari móvil y de escritorio).
La secuencia de conexión WHEPClient es muy rápida, ~ 1 segundo, mientras que el RTCPublisher , debido a su dependencia de un WebSocket , puede tardar aproximadamente 3 - 5 segundos en una conexión a la transmisión
El HLSSubscriber no pasa por una secuencia de conexión y transmite el HLS directamente desde el servidor, sin embargo, tiene una latencia de hasta 6 segundos debido a la longitud de sus segmentos vivos.
Nota : El WHIPClient y WHEPClient se introdujeron en la versión 11.0.0 del RED5 Pro WebRTC SDK.
Configuración
Deberá modificar el campo de host desde la página Configuración para señalar la dirección IP de su instancia de su servidor. Si no lo hace, los ejemplos no funcionarán cuando construya. Si está ejecutando el servidor localmente, su máquina y su dispositivo móvil deben estar en la misma red WiFi.
Nota sobre TLS y CORS
Es importante tener en cuenta que algunos de estos ejemplos, específicamente aquellos que implican publicar el uso de WEBRTC, requieren ser ejecutados en TLS y, por lo tanto, servidos a través de HTTPS. Si se ejecuta los ejemplos en localhost , no debe ver los problemas, pero si su servidor se implementa de forma remota, deberá asegurarse de que estos ejemplos se sirvan a través de HTTPS y la configuración adecuada de intercambio de recursos de origen cruzado (CORS) se define para el servidor.
- Lea más sobre Red5 Pro y SSL.
- Más información sobre CORS.
Instrucciones
Para definir la dirección IP de la instancia del servidor, abra la Testbed WebApp en un navegador y navegue a la página de configuración si no se presenta al iniciar. Para acceder a la configuración , seleccione el elemento de inicio de la lista de ejemplos ubicada en la parte superior.
Para definir el host con la IP de la instancia del servidor, haga clic en el campo de host F el formulario e ingrese en la dirección IP local o remota - por ejemplo, 10.0.0.5 , 76.199.199.199 .
Sugerencia: también puede abrir la página de destino de su instancia de servidor en el puerto 5080 (es decir, http://localhost:5080 si se inicia localmente) y la página mostrará su IP en la esquina superior derecha.
Opción de configuración de látigo/whep
Puede seleccionar preferir Whip/Whep en la página Configuración . Al seleccionar esta opción, todas las pruebas utilizarán WHEPClient y WHIPClient para publicar y suscribirse, respectivamente.
Si decide deseleccionar la opción WHIP/WHEP , todas las pruebas volverán a usar el RTCPublisher y RTCSubscriber para publicar y subcribir, respectivamente. Estas instancias requieren soporte de WebSocket en el navegador durante su etapa de negociación. Una vez que se realiza la conexión, el sistema de transporte de mensajería está cambiando a RTCDataChannel y el WebSocket está cerrado.
Ejemplos
Publicación
| Editor |
|---|
Ejemplo básico del editor utilizando WebRTC, con la opción de utilizar la ingestión de WebRTC-HTTP (también conocido como WHIP ) o WebSockets para establecer una conexión de transmisión. |
| 1080p |
|---|
| Un editor de alta calidad. |
| Añadir |
|---|
| Demuestra grabar una transmisión al servidor con la opción Append. |
| Autenticación |
|---|
| Demuestra autenticación con el Simple-Auth-Plugin para la publicación. |
| Fuente de la cámara |
|---|
| Demuestra seleccionar la cámara deseada para publicar. |
| Intercambio de cámaras |
|---|
Demuestra una solicitud de un MediaStream con una fuente video definida para la restricción basada en las cámaras traseras y frontales de un dispositivo móvil y un navegador que admite las entradas de los medios facingMode . |
| Configuración personalizada |
|---|
| Le permite personalizar la configuración de transmisión de medios para un editor de WEBRTC. |
| Configuración de audio personalizada |
|---|
| Le permite personalizar la configuración de audio para un editor de WEBRTC. |
| Intercambio de mediasstream |
|---|
Demuestra el uso de replaceTrack para intercambiar en una fuente de cámara diferente dinámicamente para editores basados en WEBRTC. |
| Captura de imágenes |
|---|
| Demuestra capturar una imagen de un video en vivo que se publica. |
| Silenciar |
|---|
| Audio apagado e inaugurador para un video en vivo que se publica. |
| Registro |
|---|
| Demuestra grabar una transmisión para la reproducción de VOD para VOD (video a pedido). |
| Añadir |
|---|
| Demuestra la función de registro de la función de transmisión para la reproducción del servidor para VOD (video-on-demand). |
| Llamada remota |
|---|
| Demuestra enviar un mensaje remoto a todos los clientes suscritos. |
| Autenticación de ida y vuelta |
|---|
| Un ejemplo de utilización de autenticación de ida y vuelta con RED5 Pro. |
| Compartir la pantalla |
|---|
Un ejemplo de utilizar las capacidades de intercambio de pantalla de Chrome y Firefox . Para usar con el ejemplo de compartir la pantalla de suscripción. |
| Objeto compartido |
|---|
| Demuestra el uso de un objeto compartido remoto para enviar y recibir información entre clientes conectados. |
| Push de la transmisión de redes sociales |
|---|
| Un ejemplo de retransmitir una transmisión en vivo a una plataforma de redes sociales. |
| VP8 |
|---|
| Un ejemplo para solicitar el códec de video VP8 en la publicación |
Publicación - Ejemplos de Stream Manager
| Gerente de transmisión |
|---|
| Demuestra utilizar la API Red5 Pro Stream Manager para publicar en el origen de un clúster de autoscalización. |
| Proxy del administrador de transmisión |
|---|
| Demuestra utilizar el administrador de Red5 Pro Stream como un proxy SSL WebSocket para publicar WEBRTC en el origen de un clúster de autoscalaje. |
| Cámara proxy del administrador de transmisión seleccionar |
|---|
| Demuestra utilizar el administrador de flujo RED5 Pro como un proxy SSL WebSocket para publicar WEBRTC en el origen de un clúster de autoscalaje con Camera Select. |
| Configuración proxy del administrador de transmisión |
|---|
| Demuestra la utilización del administrador Red5 Pro Stream como un proxy SSL WebSocket para publicar WEBRTC con configuraciones de video personalizadas para el origen de un clúster de autoscalaje. |
| Configuración de proxy de transmisión del administrador con audio |
|---|
| Demuestra utilizar el administrador Red5 Pro Stream como un proxy SSL WebSocket para publicar WEBRTC con configuraciones de audio personalizadas para el origen de un clúster de autoscalaje. |
| Stream Manager proxy de ida y vuelta autenticaion |
|---|
| Un ejemplo de la utilización de la autenticación de ida y vuelta con el proxy Red5 Pro sobre Stream Manager. |
| Stream Manager Proxy Screen Share |
|---|
| Un ejemplo de utilizar las capacidades de intercambio de pantalla de Chrome y Firefox . Para usar con el ejemplo de la pantalla de la pantalla de suscripción de la pantalla del administrador de stream. |
| Stream Manager Proxy Social Media Stream Push |
|---|
| Un ejemplo de retransmitir una transmisión en vivo a una plataforma de redes sociales. |
| Formulario de provisión de transcodificación de manager de flujo |
|---|
| Proporciona una forma fácil para publicar una nueva disposición para el administrador de transmisión para transmisiones ABR. Una vez que se publique la disposición, use su codificador de medios favorito para transmitir las variantes. |
| Transcoder proxy de Stream Manager |
|---|
| Proporciona una forma fácil para publicar una nueva disposición para el administrador de transmisión para las transmisiones ABR y para comenzar una única transmisión de variante utilizando el transcoder. |
| Transcoder proxy de Stream Manager con autenticación |
|---|
| Proporciona una forma fácil para publicar una nueva disposición para el administrador de transmisión para transmisiones ABR y para comenzar una única transmisión de variante utilizando el transcoder, incluida la autenticación. |
| Validación proxy del administrador de transmisión |
|---|
| Un ejemplo de utilizar los parámetros de validación con el proxy de Red5 Pro sobre Stream Manager. |
Multi
| Bidireccional |
|---|
| Demuestra simultáneamente la publicación mientras se suscribe, permitiendo una conversación. Incluye detección de flujo y conexión automática. |
| Proxy de administrador de transmisión de dos vías |
|---|
| El ejemplo de dos vías a través de un administrador de transmisión, incluido el uso de un proxy. Incluye detección de flujo y conexión automática. |
| Conferencia |
|---|
| Demuestra comunicación multipartidista utilizando RED5 Pro. También demuestra el uso de objetos compartidos como notificaciones para reconocer la adición y eliminación de la transmisión de partes. |
| Conferencia - Gerente de transmisión |
|---|
| Demuestra comunicación multipartidista utilizando Red5 Pro sobre Stream Manager. También demuestra el uso de objetos compartidos como notificaciones para reconocer la adición y eliminación de la transmisión de partes. |
| Objeto compartido (solo WebSockets) |
|---|
| Demuestra el uso de objetos compartidos a través de un proxy WebSocket del RED5 Pro HTML SDK. |
Suscripción
| Abonado |
|---|
Ejemplo de suscriptor básico con conmutación por error. es decir, si no se detecta el soporte del navegador WEBRTC, entonces se detecta el primer reproductor flash, entonces HLS. |
| 360 |
|---|
| Ejemplo para suscribirse a una transmisión de cámara 360 |
| Solo audio |
|---|
| Demuestra reproducción de la transmisión de solo audio. |
| Autenticación |
|---|
| Demuestra autenticación con la plugin de autocar simple para suscribirse. |
| Captura de imágenes |
|---|
| Demuestra capturar una imagen de un video en vivo que se consume. |
| Grupo |
|---|
| Demuestra acceder a una IP desde la API Red5 Pro Cluster para subcribirse a una transmisión en vivo. |
| HLS |
|---|
| Este es un ejemplo de suscripción a una transmisión usando solo HLS. En el caso de que HLS no sea compatible de forma nativa por el navegador, se utiliza la biblioteca de terceros HLS.JS. |
| Captura de imágenes |
|---|
Este ejemplo demuestra capturar una quiebra de la reproducción utilizando la API drawImage de CanvasRenderingContext2D . |
| Volver a conectar |
|---|
| Demuestra el mecanismo de conmutación por error del RED5 PRO HTML SDK para seleccionar un suscriptor basado en el soporte del navegador y para recoger automáticamente al cierre de la transmisión o pérdida de conexión. |
| Llamada remota |
|---|
| Demuestra recibir un mensaje remoto de la emisora. |
| Vuelva a intentarlo con un nombre no válido |
|---|
Demuestra utilizar la propiedad de configuración maintainConnectionOnSubscribeErrors de un suscriptor para mantener la conexión de WebSocket en los errores de la solicitud subscribe después de la intialización. |
| Autenticación de ida y vuelta |
|---|
| Un ejemplo de la utilización de la autenticación de ida y vuelta con el proxy de Red5 Pro Over Stream Manager |
| Compartir la pantalla |
|---|
| Un ejemplo de utilizar las capacidades de intercambio de pantalla de Chrome y Firefox . Para usar con el ejemplo de compartir la pantalla Publish. |
| Objeto compartido |
|---|
| Demuestra el uso de un objeto compartido remoto para enviar y recibir información entre clientes conectados. |
| Apoyar |
|---|
| Un ejemplo del uso de la API en espera para solicitar una "pausa" al recibir datos de video y audio en MediaStream, al tiempo que mantiene una conexión del cliente al servidor. |
| Interruptor de transmisión |
|---|
| Un ejemplo que demuestra el cambio de la transmisión del suscriptor actual a otra transmisión en vivo a través de WebRTC. |
| Dos corrientes |
|---|
Un ejemplo que se suscribe a dos transmisiones, utilizando el Stream1 Name y las variables Stream 2 Name en la página Configuración. |
| Video mudo |
|---|
| Ejemplo para demostrar suscribirse a una transmisión que tiene su transmisión de video "apagado". |
| VP8 |
|---|
| Demuestra solicitar la codificación de video VP8 para una transmisión de reproducción. |
Suscripción - Ejemplos de Stream Manager
| Gerente de transmisión |
|---|
| Demuestra la utilización de la API Red5 Pro Stream Manager, y actuando como SSL WebSocket proxy, para acceder a una IP de servidor Edge para suscribirse a una transmisión en vivo. |
| Proxy del administrador de transmisión |
|---|
| Demuestra utilizar la API Red5 Pro Stream Manager para acceder a una IP de servidor Edge para suscribirse a una transmisión en vivo. |
| Stream Manager proxy reconectar |
|---|
| Demuestra el mecanismo de conmutación por error del RED5 PRO HTML SDK para seleccionar un suscriptor basado en el soporte del navegador y para recoger automáticamente al cierre de la transmisión o pérdida de conexión. |
| Región proxy del gerente de transmisión |
|---|
| Demuestra utilizar la API Red5 Pro Stream Manager para acceder a una IP de servidor Edge para suscribirse a una transmisión en vivo. |
| Stream Manager Proxy Autenticación de ida y vuelta |
|---|
| Demuestra suscribirse usando autenticación de ida y vuelta, región especificada. |
| Stream Manager Proxy Transcoder (RTC) |
|---|
| Demuestra utilizar la API Red5 Pro Stream Manager para acceder a las disposiciones y una IP de servidor Edge para suscribirse a una transmisión basada en WebRTC en vivo con control de tasa de bits adaptativa. |
| Transcoder proxy del administrador de transmisión (RTMP) |
|---|
| Demuestra utilizar la API Red5 Pro Stream Manager para acceder a las disposiciones y una IP de servidor Edge para suscribirse a una transmisión en vivo basada en Flash con control de tasa de bits adaptable. |
| Transcoder proxy de manager (HLS) |
|---|
| Demuestra utilizar la API Red5 Pro Stream Manager para acceder a las disposiciones y una IP de servidor Edge para suscribirse a una transmisión basada en HLS en vivo con control de tasa de bits adaptable. |
| Stream Manager Proxy Screen Share |
|---|
| Un ejemplo de utilizar las capacidades de intercambio de pantalla de Chrome y Firefox . Para usar con el ejemplo de compartir la pantalla Publish. |
Mezclador - Ejemplos de Stream Manager
| Participante de la conferencia proxy del gerente de transmisión |
|---|
| Demuestra la utilización de la API del administrador de transmisión RED5 Pro para unirse a una conferencia de video con una sola transmisión de retorno. |
| Anfitrión de la conferencia proxy del gerente de transmisión |
|---|
| Demuestra la utilización de la API Red5 Pro Stream Manager para alojar y administrar una videoconferencia con una sola transmisión de retorno. |
| Host de composición de la cuadrícula del administrador de transmisión |
|---|
| Demuestra utilizar la API Red5 Pro Stream Manager para crear y administrar una composición de varias transmisiones en vivo en una sola transmisión. |
| Stream Manager 2x2 Ejemplo de diseño de cuadrícula |
|---|
| Demuestra componer un conjunto de transmisiones en vivo en una cuadrícula de 2x2 que se puede cargar en un mezclador RED5 Pro para crear una composición con hasta 4 transmisiones. |
| Stream Manager 3x3 Ejemplo de diseño de cuadrícula |
|---|
| Demuestra componer un conjunto de transmisiones en vivo en una cuadrícula de 3x3 que se puede cargar en un mezclador RED5 Pro para crear una composición con hasta 9 transmisiones. |
| Ejemplo de diseño de la cuadrícula del administrador de transmisión |
|---|
| Demuestra componer un conjunto de transmisiones en vivo en una cuadrícula NXN que puede cambiar el tamaño automáticamente a medida que se agregan nuevas transmisiones. La página se puede cargar en un mezclador RED5 Pro para crear una composición con muchas transmisiones. |
| Diseño de la conferencia del gerente de transmisión |
|---|
| Demuestra componer un conjunto de transmisiones en vivo en un diseño enfocado para una videoconferencia donde se destaca el presentador. La página se puede cargar en un mezclador RED5 Pro para crear una conferencia de video con una sola transmisión de retorno. |
Notas
- Para los ejemplos de suscriptores, deberá tener una transmisión en vivo que actualmente se publique y nombra basada en el campo Nombre de la transmisión 1 de la configuración . Puede usar otro dispositivo para comenzar a transmitir con esta aplicación web, o también puede usar un navegador web para publicar a través de flash, http: // your_red5_pro_server_ip: 5080/live.
- Puede ver una lista de transmisiones activas navegando a http: // your_red5_pro_server_ip: 5080/live/suscripción.jsp (deberá actualizar esta página después de haber comenzado a publicar).
- Puede acceder a la IP del servidor de su instalación de servidor RED5 Pro, que se utilizará en el campo de host de la configuración , abriendo http: // Your_Red5_Pro_Server_IP: 5080/y encontrando la IP impresa en la parte superior de la página.
- A menos que esté ejecutando el servidor localmente, WebRTC Publishing requiere un certificado SSL válido.