Exigences • Publication • Abonnement
Red5 Pro HTML Streaming Test Babeld
Ce référentiel contient un projet simple avec un certain nombre d'exemples qui peuvent être utilisés pour les tests et la référence pour le SDK Red5 Pro Webbrtc.
Exigences
Vous aurez besoin d'un web- web- (ou localement) fonctionnel, exécutant Red5 Pro Server (ou localement) pour que le navigateur client (mobile et bureau) se connecte.
Pour plus d'informations, visitez https://www.red5.net/.
Compabilité du navigateur
Le SDK Red5 Pro WebBrTC vise à utiliser WeBrTC pour sa solution de streaming (à la fois publier et souscripteur), mais fournit également une prise en charge HLS pour les navigateurs qui le prennent en charge nativement (par exemple, mobile et de bureau safari).
Plus d'informations sur la compabilité du navigateur peuvent être consultées sur les informations de connexion par les pairs Webrtc sur caniuse.com.
Éditeur
Le terme éditeur dans le contexte de Red5 Pro fait référence à un client qui produit un flux de diffusion. Il existe deux types d'instances du SDK qui peuvent être utilisées pour démarrer un éditeur :
-
WHIPClient - Le WHIPClient s'appuie sur le protocl d'ingestion WebBrTC-HTP pour établir une connexion par le biais d'une série de demandes HTTP / S. -
RTCPublisher - Le RTCPublisher s'appuie sur une connexion WebSocket pour établir une session de diffusion.
La séquence de connexion WHEPClient est très rapide - ~ 1 seconde - tandis que le RTCPublisher , en raison de sa dépendance sur un WebSocket peut prendre environ 3 à 5 secondes pour une connexion à diffuser.
Abonné
Le terme abonné dans le contexte de Red5 Pro fait référence à un client qui consomme et lecture un flux de diffusion déjà en direct. Il existe trois types d'instances du SDK qui peuvent être utilisées pour démarrer un abonné :
-
WHEPClient - Le WHEPClient s'appuie sur le protocole de sortie WebBrTC-HTP pour établir une connexion via une série de demandes HTTP / S. -
RTCSubscriber - Le RTCSubscriber s'appuie sur une connexion WebSocket pour établir une session de diffusion. -
HLSSubscriber - Le HLSSubscriber s'appuie sur la capacité native à lire les flux HLS (par exemple, Mobile et Desktop Safari).
La séquence de connexion WHEPClient est très rapide - ~ 1 seconde - tandis que le RTCPublisher , en raison de sa dépendance sur un WebSocket peut prendre environ 3 à 5 secondes pour une connexion à diffuser
Le HLSSubscriber ne passe pas par une séquence de connexion et diffuse le HLS directement à partir du serveur, mais il a une latence allant jusqu'à 6 secondes en raison de la durée de ses segments vivants.
Remarque : Le WHIPClient et WHEPClient ont été introduits dans la version 11.0.0 du SDK Red5 Pro Webbrtc.
Installation
Vous devrez modifier le champ hôte de la page Paramètres pour pointer vers l'adresse IP de votre instance de serveur. Si vous ne le faites pas, les exemples ne fonctionneront pas lorsque vous construisez. Si vous exécutez le serveur localement, votre machine et votre appareil mobile doivent être sur le même réseau WiFi.
Note sur TLS et CORS
Il est important de noter que certains de ces exemples - en particulier ceux qui impliquent une publication en utilisant weBrTC - nécessitent d'être exécutés sur TLS et, par conséquent, servis sur HTTPS. Si l'exécution des exemples sur localhost , vous ne devriez pas voir de problèmes, mais si votre serveur est déployé à distance, vous devrez être sûr que ces exemples sont servis sur HTTPS et les paramètres de partage de ressources croisées (CORS) appropriés sont définis pour le serveur.
- En savoir plus sur Red5 Pro et SSL.
- Plus d'informations sur CORS.
Instructions
Pour définir l'adresse IP de l'instance du serveur, ouvrez le TestBed WebApp dans un navigateur et accédez à la page Paramètres si elle n'est pas présentée lors du lancement. Pour accéder aux paramètres , sélectionnez l'élément d'accueil dans la liste d'exemples située en haut.
Pour définir l' hôte avec l'IP de l'instance du serveur, cliquez sur le champ hôte f le formulaire et entrez dans l'adresse IP locale ou distante - par exemple, 10.0.0.5 , 76.199.199.199 .
Astuce: vous pouvez également ouvrir la page de destination de l'instance de votre serveur au port 5080 (c'est-à-dire http://localhost:5080 si elle est lancée localement) et la page affichera son IP dans le coin supérieur droit.
Option de paramètres de fouet / whep
Vous pouvez sélectionner pour préférer WHIP / WHEP dans la page Paramètres . En sélectionnant cette option, tous les tests utiliseront respectivement le WHEPClient et WHIPClient pour la publication et l'abonnement.
Si vous décidez de désélectionner l'option WHIP / WHEP , tous les tests reviendront à l'utilisation du RTCPublisher et RTCSubscriber pour la publication et le sous-ciblage, respectivement. Ces instances nécessitent une prise en charge de WebSocket dans le navigateur pendant leur phase de négociation. Une fois la connexion établie, le système de transport de messagerie passe à RTCDataChannel et le WebSocket est fermé.
Exemples
Édition
| Éditeur |
|---|
Exemple de base de l'éditeur à l'aide de WebBrTC, avec une option d'utilisation de l'ingestion WebBrTC-HTP (AKA, WHIP ) ou WebSockets pour établir une connexion de diffusion. |
| 1080p |
|---|
| Un éditeur de haute qualité. |
| Ajouter |
|---|
| Démontre l'enregistrement d'un flux vers le serveur avec l'option APPEND. |
| Authentification |
|---|
| Démontre l'authentification avec le bouton d'autant simple pour la publication. |
| Source de caméra |
|---|
| Démontre la sélection de la caméra souhaitée avec qui publier. |
| Échange de caméra |
|---|
Démontre une demande de MediaStream avec une source video définie pour la contrainte basée sur les caméras arrière et avant de l'appareil mobile et un navigateur qui prend en charge les contre-médias facingMode . |
| Paramètres personnalisés |
|---|
| Vous permet de personnaliser les paramètres de diffusion multimédia pour un éditeur WebBrTC. |
| Paramètres audio personnalisés |
|---|
| Vous permet de personnaliser les paramètres audio pour un éditeur WebBrTC. |
| Swap MediaStream |
|---|
Démontre l'utilisation replaceTrack pour échanger dans une autre source de caméra dynamiquement pour les éditeurs basés sur WeBRTC. |
| Capture d'image |
|---|
| Démontre la capture d'une image d'une vidéo en direct publiée. |
| Muet |
|---|
| MUTING ET SUR LE SUPPRIMATEUR AUDIO POUR UNE VIDÉO EN DIMIQUE PUBLIÉS. |
| Enregistrer |
|---|
| Démontre l'enregistrement d'un flux vers le serveur pour la lecture VOD (vidéo-surmand). |
| Ajouter |
|---|
| Démontre la fonction enregistrée d'un flux vers le serveur pour la lecture VOD (vidéo-surmand). |
| Appel à distance |
|---|
| Démontre l'envoi d'un message distant à tous les clients abonnés. |
| Authentification aller-retour |
|---|
| Un exemple d'utilisation d'authentification aller-retour avec Red5 Pro. |
| Partage d'écran |
|---|
Un exemple d'utilisation des capacités de partage d'écran de Chrome et Firefox .
Pour une utilisation avec l'exemple de partage d'écran abonné. |
| Objet partagé |
|---|
| Démontre à l'aide d'un objet partagé distant pour envoyer et recevoir des informations entre les clients connectés. |
| Push des flux de médias sociaux |
|---|
| Un exemple de rediffusion d'un flux en direct sur une plate-forme de médias sociaux. |
| VP8 |
|---|
| Un exemple pour demander du codec vidéo VP8 sur Publish |
Publication - Exemples de gestionnaire de flux
| Gestionnaire de cours d'eau |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour publier sur l'origine d'un cluster de mise en œuvre. |
| Stream Manager Proxy |
|---|
| Démontre l'utilisation du Red5 Pro Stream Manager en tant que proxy SSL WebSocket pour publier WEBRTC à l'origine d'un cluster de mise à l'échelle. |
| Stream Manager Proxy Camera SELECT |
|---|
| Démontre l'utilisation du Red5 Pro Stream Manager en tant que proxy SSL WebSocket pour publier WEBRTC à l'origine d'un cluster de mise à l'échelle avec la sélection de la caméra. |
| Paramètres de proxy Stream Manager |
|---|
| Démontre l'utilisation du Red5 Pro Stream Manager en tant que proxy SSL WebSocket pour publier WeBRTC avec des paramètres vidéo personnalisés sur l'origine d'un cluster de mise à l'échelle. |
| Paramètres de proxy Stream Manager avec audio |
|---|
| Démontre l'utilisation du Red5 Pro Stream Manager en tant que proxy SSL WebSocket pour publier WeBrTC avec des paramètres audio personnalisés sur l'origine d'un cluster de mise à l'échelle. |
| Stream Manager Proxy aller-retour authenticon |
|---|
| Un exemple d'utilisation d'authentification aller-retour avec le proxy Red5 Pro sur Stream Manager. |
| Stream Manager Proxy Screen Share |
|---|
| Un exemple d'utilisation des capacités de partage d'écran de Chrome et Firefox . Pour une utilisation avec l'exemple de partage d'écran de Stream Manager, souscrit. |
| Stream Manager Proxy Proxy Social Media Stream Push |
|---|
| Un exemple de rediffusion d'un flux en direct sur une plate-forme de médias sociaux. |
| Stream Manager Transcode Formation de provision |
|---|
| Fournit un formulaire facile pour publier une nouvelle disposition au gestionnaire de flux pour les diffusions ABR. Une fois la disposition publiée, utilisez votre encodeur multimédia préféré pour diffuser les variantes. |
| Stream Manager Proxy Transcoder |
|---|
| Fournit un formulaire facile pour publier une nouvelle disposition au Stream Manager pour les diffusions ABR et pour démarrer une seule variante diffusée à l'aide du transcoder. |
| Stream Manager Proxy Transcoder avec authentification |
|---|
| Fournit un formulaire facile pour publier une nouvelle disposition au Stream Manager pour les diffusions ABR et pour démarrer une seule variante diffusée à l'aide du transcoder, y compris l'authentification. |
| Validation de proxy Stream Manager |
|---|
| Un exemple d'utilisation des paramètres de validation avec le proxy Red5 Pro sur Stream Manager. |
Multi
| À double sens |
|---|
| Démontre la publication simultanément lors de l'abonnement - permettant une conversation. Comprend la détection des flux et la connexion automatique. |
| Proxy de gestionnaire de cours d'eau à double sens |
|---|
| L'exemple bidirectionnel via un gestionnaire de flux - y compris l'utilisation d'un proxy. Comprend la détection des flux et la connexion automatique. |
| Conférence |
|---|
| Démontre une communication multipartite à l'aide de Red5 Pro. Il démontre également l'utilisation d'objets partagés comme notifications pour reconnaître l'addition et la suppression de la diffusion des parties. |
| Conférence - Stream Manager |
|---|
| Démontre une communication multipartite à l'aide de Red5 Pro sur Stream Manager. Il démontre également l'utilisation d'objets partagés comme notifications pour reconnaître l'addition et la suppression de la diffusion des parties. |
| Objet partagé (WebSockets uniquement) |
|---|
| Démontre l'utilisation d'objets partagés via un proxy WebSocket à partir du SDK RED5 Pro HTML. |
Abonnement
| Abonné |
|---|
Exemple d'abonné de base avec basculement.
c'est-à-dire, si aucune prise en charge du navigateur WebTC, le premier lecteur flash est détecté, alors HLS. |
| 360 |
|---|
| Exemple de souscription à un flux de caméra 360 |
| Audio uniquement |
|---|
| Démontre la lecture du flux audio uniquement. |
| Authentification |
|---|
| Démontre l'authentification avec le bouton d'automne simple pour l'abonnement. |
| Capture d'image |
|---|
| Démontre la capture d'une image d'une vidéo en direct consommée. |
| Grappe |
|---|
| Démontre l'accès à une IP à partir de l'API du cluster Red5 Pro pour s'inscrire à un flux en direct. |
| HLS |
|---|
| Ceci est un exemple de souscription à un flux en utilisant HLS uniquement. Dans le cas où HLS n'est pas pris en charge nativement par le navigateur, la bibliothèque HLS.JS 3e-parti est utilisée. |
| Capture d'image |
|---|
Cet exemple démontre la capture d'un calme de la lecture en utilisant l'API drawImage de CanvasRenderingContext2D . |
| Reconnecter |
|---|
| Démontre le mécanisme de basculement du SDK RED5 Pro HTML pour sélectionner un abonné en fonction de la prise en charge du navigateur et de la connexion automatique à la fermeture de la diffusion ou de la perte de connexion. |
| Appel à distance |
|---|
| Démontre la réception d'un message distant du diffuseur. |
| Réessayer sur le nom non valide |
|---|
Démontre l'utilisation de la propriété de configuration de maintainConnectionOnSubscribeErrors d'un abonné afin de maintenir la connexion WebSocket lors des erreurs de la demande subscribe après l'intialisation. |
| Authentification aller-retour |
|---|
| Un exemple d'utilisation d'authentification aller-retour avec le proxy Red5 Pro sur Stream Manager |
| Partage d'écran |
|---|
| Un exemple d'utilisation des capacités de partage d'écran de Chrome et Firefox . Pour une utilisation avec un exemple de partage d'écran de publication. |
| Objet partagé |
|---|
| Démontre à l'aide d'un objet partagé distant pour envoyer et recevoir des informations entre les clients connectés. |
| Attendre |
|---|
| Un exemple d'utilisation de l'API de secours pour demander une "pause" dans la réception de données vidéo et audio sur le médiaStream tout en maintenant une connexion du client au serveur. |
| Interrupteur de flux |
|---|
| Un exemple qui démontre la commutation du flux de l'abonné actuel vers un autre flux en direct via WeBrTC. |
| Deux flux |
|---|
Un exemple qui souscrit à deux flux, en utilisant les variables Stream1 Name et Stream 2 Name à partir de la page Paramètres. |
| Video muet |
|---|
| Exemple pour démontrer l'abonnement à une émission qui a son flux vidéo "Moited". |
| VP8 |
|---|
| Démontre la demande de codage vidéo VP8 pour un flux de lecture. |
Abonnement - Exemples de gestionnaire de flux
| Gestionnaire de cours d'eau |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager et agir en tant que proxy SSL WebSocket, pour accéder à une IP Edge Server pour s'abonner à un flux en direct. |
| Stream Manager Proxy |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour accéder à une IP Edge Server pour s'abonner à un flux en direct. |
| Stream Manager Proxy Reconnect |
|---|
| Démontre le mécanisme de basculement du SDK RED5 Pro HTML pour sélectionner un abonné en fonction de la prise en charge du navigateur et de la connexion automatique à la fermeture de la diffusion ou de la perte de connexion. |
| Région proxy du gestionnaire de cours d'eau |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour accéder à une IP Edge Server pour s'abonner à un flux en direct. |
| Authentification aller-retour proxy Stream Manager |
|---|
| Démontre l'abonnement à l'aide d'authentification aller-retour, région spécifiée. |
| Stream Manager Proxy Transcoder (RTC) |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour accéder aux provisions et une IP Edge Server pour s'abonner à un flux en direct basé sur WEBRTC avec un contrôle de débit adaptatif. |
| Stream Manager Proxy Transcoder (RTMP) |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour accéder aux provisions et une IP Edge Server pour s'abonner à un flux en direct basé sur Flash avec un contrôle de débit adaptatif. |
| Stream Manager Proxy Transcoder (HLS) |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour accéder aux provisions et une IP Edge Server pour s'abonner à un flux en direct basé sur HLS avec un contrôle de débit adaptatif. |
| Stream Manager Proxy Screen Share |
|---|
| Un exemple d'utilisation des capacités de partage d'écran de Chrome et Firefox . Pour une utilisation avec un exemple de partage d'écran de publication. |
Mixer - Exemples de gestionnaire de flux
| Stream Manager Proxy Conference Participant |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour rejoindre une conférence vidéo avec un seul flux de retour. |
| Hôte de conférence de proxy Manager Stream |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour héberger et gérer une conférence vidéo avec un seul flux de retour. |
| Hôte de composition de grille de gestionnaire de flux |
|---|
| Démontre l'utilisation de l'API Red5 Pro Stream Manager pour créer et gérer une composition de plusieurs flux en direct dans un seul flux. |
| Exemple de mise en page de la grille Stream Manager 2x2 |
|---|
| Démontre la composition d'un ensemble de flux en direct dans une grille 2x2 qui peut être chargée dans un mélangeur Red5 Pro pour créer une composition avec jusqu'à 4 flux. |
| Exemple de mise en page Stream Manager 3x3 Grid |
|---|
| Démontre la composition d'un ensemble de flux en direct dans une grille 3x3 qui peut être chargée dans un mélangeur Red5 Pro pour créer une composition avec jusqu'à 9 flux. |
| Exemple de mise en page NXN Gestionnaire NXN |
|---|
| Démontre la composition d'un ensemble de flux en direct dans une grille NXN qui peut automatiquement redimensionner à mesure que de nouveaux flux y sont ajoutés. La page peut être chargée dans un mélangeur Red5 Pro pour créer une composition avec de nombreux flux. |
| Disposition de conférence Stream Manager |
|---|
| Démontre la composition d'un ensemble de flux en direct dans une disposition ciblée pour une conférence vidéo où le présentateur est mis en évidence. La page peut être chargée dans un mélangeur Red5 Pro pour créer une conférence vidéo avec un seul flux de retour. |
Notes
- Pour les exemples d'abonnés, vous devrez avoir un flux en direct en cours de publication et nommé en fonction du champ Nom Stream 1 des paramètres . Vous pouvez utiliser un autre appareil pour commencer le streaming à l'aide de ce WebApp, ou vous pouvez également utiliser un navigateur Web pour publier via Flash, http: // your_red5_pro_server_ip: 5080 / live.
- Vous pouvez voir une liste de flux actifs en naviguant vers http: // your_red5_pro_server_ip: 5080 / live / abonne.
- Vous pouvez accéder au serveur IP de votre installation Red5 Pro Server - à utiliser dans le champ hôte des paramètres - en ouvrant http: // your_red5_pro_server_ip: 5080 / et en trouvant l'IP imprimé en haut à droite de la page.
- À moins que vous exécutiez le serveur localement, la publication WebBrTC nécessite un certificat SSL valide.
