Caméra dans le navigateur. Skype, instructions pas à pas pour la création d'applications WEBRTC - vue "à l'extrême". Ça informe. Comment organiser la diffusion de WEBRTC en ligne à l'aide de Webcam et VPS Server Test des émissions en ligne WEBRTC

Dans cet article, je tiens à indiquer comment utiliser WEBRTC et Bitrix Technologies, créez votre application Web multimédia :)

Un peu sur la technologie

La technologie WEBRTC est apparue relativement récemment, le premier projet a été introduit en novembre 2012 et littéralement pour la technologie de l'année a atteint un bon niveau et il est déjà possible de l'utiliser.

La technologie offre aux développeurs la possibilité de créer des applications Web multimédia (appels vidéo / audio) sans avoir à télécharger et à installer des plugins supplémentaires.
Son objectif est de créer une plate-forme unique pour les communications en temps réel, qui fonctionnera dans n'importe quel navigateur et sur tout système d'exploitation.

Plus récemment, la liste des applications prises en charge était très petite et consistait en un seul navigateur: Google Chrome.
Au cours de la dernière année, cette liste s'est considérablement développée et la technologie a commencé à soutenir presque tous les navigateurs modernes :)

Pour le moment, il est: Mozilla Firefox 27+ et basé sur les navigateurs Webkit - Google Chrome 29+, Opera 18+, Yandex.Browser 13+.
J'espère que Safari sera bientôt dans cette liste, puisque la société est entrée dans le groupe de travail de la WEBRTC février 2014..

Malheureusement, Microsoft ne prévoit pas de mettre en œuvre WEBRTC et de créer sa technologie Web CU-RTC-Web, mais peut-être que leur technologie rendra leur technologie plus ou moins compatible.
Pour les utilisateurs d'Internet Explorer, nous proposons de publier une application de bureau basée sur chrome et d'offrir à ses navigateurs sans soutenir cette technologie.

Sur la manière dont nous utilisons la technologie WEBRTC et le travail de l'application de bureau, j'ai raconté sur Conférence de partenaire d'hiver 1c-bitrixVous pouvez regarder mon rapport en ligne ou télécharger une vidéo :)

Comment fonctionne Webrtc?

Après avoir lu les lignes ci-dessus, vous avez probablement déjà manqué de faire l'application WEBRTC et fermée pratiquement la page :)


Mais pour toucher la panique!Nous avons déjà tout dans le produit, voyons pour vous-même:

1. Protocole d'alarme En temps réel Vous pouvez organiser sur la base de notre poussée et de notre traction et du module du mode NGinx Server - NGinx-Push-Stream-Mode, comment travailler avec eux en détail écrit dans mon blog sur le bitmix (si Cette option que vous ne correspond pas, vous pouvez facilement remplacer un autre produit, par exemple sur Socket.IO);

2. Pour crawler Nata, nous avons créé un service de cloud qui est disponible pour tous les utilisateurs de produits à tURN.CALLS.BITRIX24.com;

et la chose la plus agréable :)

4. Nous avons développé un composant spécial dans lequel toutes les logiques sont implémentées pour ce que vous pouvez rapidement approfondir et commencer à écrire votre application (le composant est disponible dans le module PUSH & TRIM de la version 14.1.5);

Exécuter l'application de démonstration :)

Dans le module Push & Pull (/ Bitrix / Modules / Pul / Pul /), à partir de la version 14.1.5, un dossier est apparu démo. Il y en a actuellement deux exemples:
1. Un exemple de travail avec le module "Push & Tir";
2. exemple de travail avec WEBRTC;

À propos de la seconde voulait juste parler :)

Pour commencer à travailler, procédez comme suit:
1. Copiez le composant du dossier / bitrix / modules / traction / démo / webrtc / compactants /, par exemple ici / bitrix / Compactens / YourCompanyPrefix /
2. Copiez la page / BITRIX / MODULES / TIX / DEMO / WEBRTC / HTML /, par exemple, à la racine de votre site;
3. Configurez le module PUSH & TRIM pour fonctionner avec le serveur de file d'attente;
4. enregistrer deux utilisateurs;

Tout, vous pouvez maintenant aller à cette page sous deux utilisateurs différents et commencer à vous appeler :)

La meilleure documentation est le code source

Je vais décrire brièvement le but de chaque fonction, qui sont utilisés dans Demo_WebUtC.js (situé dans le composant), tout le reste, j'espère que ce sera clair du code source.

Ce qui serait préférable de comprendre le composant et de la manière dont cela fonctionne, lisez ces deux articles, cela vous aidera plus facilement à naviguer:
Création de votre bibliothèque JS: JS, CSS, phrases, dépendances.
Travailler avec le module "push & tire"

WEBRTC: initialisation

YourCompanyPrefix.webrtc ()
Cette classe de classe WEBRTC décrit les valeurs par défaut et fonctionnent avec la signalisation.
Remarque: Bx.Garbage fonctionnera lors de la sortie de la page ou du redémarrage, vous pouvez ainsi couper l'appel.

Bx.inheritwebrtc (YourCompanyPrefix.webrtc);
Cette fonctionnalité doit être effectuée immédiatement après l'initialisation, elle publiera toutes les classes de base de notre bibliothèque de base BX.WEBTC

WEBRTC: API Usermedia

YourCompanyPrefix.webrtc.startGetTretermedia.
Fonction pour un accès rapide à la caméra vidéo et au microphone

YourCompanyPrefix.webrtc.onusermediascessess.
Cette fonctionnalité est appelée lorsque l'événement est déclenché par l'événement "Accès réussi à l'équipement".

YourCompanyPrefix.webrtc.onusermedierror.
Cette fonctionnalité est appelée lorsque l'événement d'erreur est déclenché par l'événement

WEBRTC: Peerconnection API

YourCompanyPrefix.webrtc.setlocalandsend.
La fonction définit les méta-informations sur l'utilisateur actuel et le transmet à un autre utilisateur.
YourCompanyPrefix.webrtc.onremoteMamaDded
Cette fonctionnalité est appelée lorsqu'un événement est déclenché par un flux de support distant, pour l'afficher dans la balise vidéo.

YourCompanyPrefix.webrtc.onremotestrémoveamremoved.
Cette fonctionnalité est appelée lorsque l'événement est déclenché par l'événement "Disabledi Media-Flow", pour l'éteindre dans la balise vidéo

YourCompanyPrefix.webrtc.onicecandidate.
Cette fonctionnalité est appelée lorsque l'événement est déclenché par le "sur la nécessité de transmettre des méta-informations sur les codecs, la propriété intellectuelle et d'autres informations" à un autre utilisateur

YourCompanyPrefix.webrtc.peerconnectionRorror
La fonction est appelée lorsque l'erreur de connexion se produit entre les utilisateurs

YourCompanyPrefix.webrtc.peerconnectionReconnect.
La fonction envoie une demande d'essayer de reconnecter l'utilisateur à une session existante, par exemple en raison de l'erreur.

Voscompanyprefix.webrtc.deleeevents.
La fonction réinitialise toutes les variables modifiées pour un nouvel appel.

WEBRTC: API de signalisation

YourCompanyPrefix.webrtc.callinvite.
Fonction pour envoyer une invitation à un autre utilisateur dans un appel vidéo

YourCompanyPrefix.webrtc.calnswer.
Fonction pour envoyer la confirmation au paramètre d'appel vidéo

VotreCompanyPrefix.webrtc.caldecline.
Fonction d'envoi d'annulation ou d'appel vidéo

YourCompanyPrefix.webrtc.CallCallCommand.
Fonction pour envoyer d'autres commandes à un autre utilisateur (l'utilisateur est prêt à installer la connexion, l'utilisateur est occupé et ainsi de suite)

WEBRTC: Commandes de base (de la bibliothèque Core_webrtc.js)

YourCompanyPrefix.webrtc.ready.
Chèque est disponible webrtc dans le navigateur actuel

YourCompanyPrefix.webrtc.signaliningReadady.
Le chèque est disponible pour signaler sur la page en cours

YourCompanyPrefix.webrtc.toggleudio.
Allumer / désactiver le microphone

VotreCompanyPrefix.webrtc.togglevideo.
Allumer / désactiver la caméra
VotreCompanyPrefix.webrtc.oniceconnectionStatechange.
La fonction est appelée lorsque l'événement d'installation de connexion est déclenché

YourCompanyPrefix.webrtc.onignalingStatechange.
La fonction est appelée lorsque l'événement "Modifier la communication Change" est déclenché

VotreCompanyPrefix.webrtc.attachmediatream
Fonction d'installation de la vidéo / audio dans la vidéo Tag

VotreCompanyPrefix.webrtc.log.
Fonction de connexion

J'espère que cet article vous sera utile.

Openok, pubnub et webrtc

Platformes en nuage Opentok et Pubnub pour développer des services de communication basés sur la WEBRTC

2016-04-08

Actuellement, les chats vidéo Web deviennent de plus en plus populaires. Web Video Chat est une application Web pour la boîte de dialogue pour la communication basée sur un serveur Web et des navigateurs.

De toutes les technologies existantes pour la construction d'une vidéo Web (Ajax; Java; Technologie Flash; ASP.NET + Silverlight; HTML5 + JavaScript basé sur l'API WEBRTC, etc.) La technologie la plus prometteuse est l'API WEBRTC. Les salles de discussion en ligne reposant sur la base de la technologie WEBRTC constituent une transmission de texte, des voix, des vidéos et des données de haute qualité (fichiers) sans installer des plug-ins ou des extensions supplémentaires dans les navigateurs. Les principaux éléments du chat vidéo sur WEBRTC sont un navigateur et un serveur de contacts.

Le navigateur WEBRTC devient une interface unique pour tous les périphériques utilisateur (PC, smartphones, iPads, téléphones IP, téléphones mobiles, etc.) qui fonctionnent avec des services de communication. WEBRTC avec Websocket, HTML5, CSS3 et JavaScript vous permettent de créer des services de communication Web de nouvelle génération. La technologie WEBRTC est implémentée par trois interfaces API JavaScript.

Pour le fonctionnement de la peering est nécessaire avec deux navigateurs prenant en charge WEBRTC, contactez l'adresse IP sur le serveur de signal (par exemple, Server WebSocket) en cours d'exécution sur Node.js. Le serveur ne participe pas à la transmission des flux d'informations entre navigateurs et est une alarme et est destiné à définir la connexion entre les navigateurs d'utilisateurs.

En raison du fait que la prise en charge de la WEBRTC est effectuée par tous les hébergements, de mettre en œuvre des applications de communication basées sur l'API de la WEBRTC et de les intégrer à des sites Web (sites Web) d'Internet, vous pouvez utiliser des plates-formes spéciales qui prennent en charge WEBRTC et fournissant des API et des SDK.

L'API assure l'interaction des applications de communication avec une plate-forme (service Web) fournissant cette API, et le SDK fournit le développement d'applications de communication pouvant interagir avec la plate-forme qui fournit ce SDK.

Ces plates-formes comprennent: OPENTOK de Tokbox, Pubnub, Voximplant, Twilio, Skyway de NTT Communications, Kandy.io, ViseurCall, etc. Il convient de noter que pour créer un serveur de contacts, vous pouvez déployer Node.js pour les applications de communication Web sur le serveur virtuel localisé ou utiliser un hébergement de plate-forme cloud (PAA), qui supportent des projets basés sur Node.js, par exemple, OpenShift / Chapeau rouge, Heroku / Salesforce, AWS Elastic BeanStalk / Amazon, etc.

De plus, pour créer une application de communication, vous pouvez acheter la plate-forme de serveur d'appel Web Flashphoner (logiciel serveur conçu pour organiser des émissions de navigateurs en ligne de flux audio et vidéo), basé sur la technologie Web HTML5, WEBRTC et Flash, et l'installer sur Le Web -Server sous le serveur VPS virtuel OC Linux ou loué. Actuellement, Flashphoner a déployé son serveur WEBRTC (serveur d'appel Web 5) sur l'hébergement nuageux Amazon Web Services.

Dans cet examen, envisagez les services Web les plus populaires de la communication sur le cloud basé sur la technologie WEBRTC - OPENTTOK de Tokox et Pubnub.

Opentok de Tokox.

OPENTOK est une plate-forme de PAA Cloud (plate-forme en tant que service), qui est la plate-forme de communication hôte de la WEBRTC pour l'intégration de sites Web et d'outils de communication mobiles et de messagerie. OPENTOK a une infrastructure distribuée contenant des centres de traitement de données dans le monde entier.

La plate-forme Open OpenOK de Tokbox fournit aux développeurs la possibilité d'intégrer des échantillons vidéo multiples plate-forme basés sur l'API WEBRTC sur l'application Web (sites Web), Java / Android et IOS Application.

L'architecture OPENTOK est composée de la partie client de la bibliothèque WEBRTC OPENOK (par exemple, OPENTOK.JS), qui fournit des liens vidéo d'intégration à la partie client de l'application (page Web) et à l'ensemble des outils (OpenOk Client SDK) pour le Développement d'applications clientes (applications JavaScript / Web, Java OS / Android et IOS OS).

De plus, la partie composite de l'architecture OPENTOK est le serveur SDK (Openk Server SDKS), qui sont conçues pour développer une infrastructure de serveur (pour gérer et authentifier les utilisateurs) une application qui fournit une génération dynamique d'identificateurs uniques de l'ID et des marqueurs openk ( Jeton) pour chaque utilisateur, ainsi que de travailler avec OpentOk Archives. Le serveur Web transmet l'identifiant de session approprié et le marqueur que le client peut ensuite utiliser pour se connecter à la session.

Server SDKS OPENTOK est disponible pour les principales langues de programmation de la partie serveur des applications: Java, .NET, NODE.JS, PHP, Python, Ruby. Il convient de noter que si un autre langage de programmation est requis pour la partie serveur de l'application, qui n'est pas inclus dans la liste répertoriée, Tokox fournit une API de repos OPENTOK pour créer des sessions OPENTOK et travailler avec OPENTOK Archives.

Ainsi, pour créer des applications de communication pour les nœuds Internet, utilisez Server SDKS OPHOPOK en combinaison avec la bibliothèque client WEBRTC OPENOK et les SDKS Client Openment Client.


Pour utiliser la plate-forme OPENTOK pour créer un chat vidéo WEBRTC incorporé sur Internet, vous devez tout d'abord créer un compte sur Tokox.com. Compte gratuit sur Opentok est valable de trente jours. L'utilisateur enregistré a la possibilité d'obtenir la clé de l'API (APIKEY) nécessaire pour développer l'application de communication OPENTOK. La clé API identifie le compte de développeur OPENTOK.

Utilisation du Guide du développeur OPENTOK (https://tokbox.com/developer/guides/) dans le compte de développeur Tokox, vous pouvez créer une application de communication (page Web de chat vidéo) à l'aide des SDKS client OPENTOK. Pour utiliser la plate-forme OPENTOK pour l'application, vous devez activer la bibliothèque OPENTOK.js à la page Web.

https://static.opentok.com/webrtc/ ... / openk.js

Identificateur de session (sessionId) et marqueur (jeton) L'application requise pour le fonctionnement est généralement créée par programmation sur un serveur Web avec l'un des SDKS Server (Openk Server SDKS).

Mais pour créer une version de test de l'application sans serveur SDKS OPENTOK, vous pouvez, basé sur la touche API (APIKEY), obtenir une pièce d'identité de session et un marqueur pour cet identifiant de session manuellement à l'aide de la barre d'outils du développeur. Le client a besoin d'un marqueur qui lui donne accès à la session.

Des échantillons de telles variables telles que la clé "apikey", l'identifiant de session "SessionID" et le marqueur "jeton" sont:

var Apikey = "17493650";
var sessionId \u003d "2_mx40nt ... twxr-uh4";
var jeton. \u003d "T1 \u003d\u003d CGFYD ... 2RHDGE9";

Après avoir créé un objet de session avec un identifiant de session (sessionID) et un marqueur (jeton), l'application initialise l'objet de session.

var session \u003d ot.initsession (apketé, sessionID);

Le client est ensuite connecté à la session et à la publication des flux audio et vidéo:

session.Connect (jeton, fonction (erreur) (
Publisher \u003d ot.initpublisher ("éditeur");
session.publish (éditeur);
});

Après avoir connecté le client à la session, l'application initialise l'objet OPENTOK Publisher OPENTOK et publie le flux audio et vidéo pour cette session pour voir d'autres clients.

session.on (((
StreamCréé: fonction (événement) (
session.subscribe (événement.stream, "abonné");
}});

Ainsi, conformément au développement du développeur, vous pouvez créer la base du chat vidéo WEBRTC basé sur la plate-forme OPENTOK, qui peut être implémentée sur votre site Web. La figure 2 montre l'interface de la capture d'écran de cette chat vidéo sur la WEBRTC créée dans le compte de développeur Tokox.

Ensuite, vous devez créer une partie serveur de la chat vidéo à l'aide des SDK Openk Server pour l'une des langues de programmation. Openk Server SDKS vous permet de créer des sessions OPENTOK de manière programmatique, de générer des marqueurs et de travailler avec l'archivage OPENTOK.

Il convient de noter que la tokbox utilise deux flux multimédia (flux multimédia):

  • relayed (relais), dans ce mode, les flux de support sont transmis directement entre le peering (par exemple, entre les navigateurs d'utilisateurs dans le compartiment vidéo, un à un);
  • roué (routage), dans ce mode, à l'aide du routeur de média openk pour rouler des flux audio-vidéo entre clients (par exemple, dans le chat vidéo multijoueur ou groupe pour les réunions en ligne).

Pubnub.

Pubnub est un réseau mondial de diffusion de données pour: IOT (Internet des objets), Mobile et Web. Pubnub est un service de messagerie Web nuageux en temps réel destiné à organiser des communications Web entre différentes plates-formes: téléphones mobiles, tablettes, navigateurs Web de nœuds Web, etc. Pubnub fournit plus de 70 SDK pour les langages de programmation de base afin de créer des applications de communication multiplate-forme et de les intégrer aux applications Web (sites Web) et aux appareils mobiles (Java / Android et IOS OS).

La liste des langues prises en charge et le service SDKS PUBNUB est présentée à la page suivante: https://github.com/pubnub/pubnub-api. Il convient de noter qu'en plus des API, le logiciel PUBNUB soutient également l'API de repos. Par exemple, PUBNUB WEBRTC SDK est conçu pour organiser des communications Web (réseaux sans pairs) en temps réel entre les navigateurs sur une architecture peer-to-peer. L'architecture de l'interaction des composants de l'application de communication basée sur la plate-forme PUBNUB et la technologie WEBRTC est présentée à la Fig. 3.

Comme suit l'interaction du circuit des composants WEBRTC de la discussion vidéo (figure 3), la plate-forme PUBNUB est utilisée comme serveur d'alarme évolutif (serveur correspondant) pour les applications WEBRTC. De plus, la plate-forme PUBNUB fournit des fonctionnalités supplémentaires telles que la présence (fournissant des informations sur les réseaux disponibles sur le réseau ou sur la liste actuelle des utilisateurs), le stockage / la lecture (permet aux utilisateurs de voir l'historique des conversations passées pendant une certaine période) et enregistrement.

Dans les applications WEBRTC de communication basées sur la plate-forme PUBNUB, deux méthodes de messagerie (WebSockets et Ajax) sont utilisées entre le navigateur et le serveur correspondant. Pubnub propose une nouvelle API pour connecter l'application WEBRTC à la plate-forme PUBNUB. WEBRTC API PUBNUB Effectue une alarcité entre les navigateurs d'utilisateurs pour leur permettre de se connecter à une architecture homologue à l'aide de l'API de Peerconnection WEBRTC. Après l'échange de messages de signaux entre navigateurs, une connexion en duplex est établie entre eux pour échanger des flux vidéo et des données arbitraires. La communication du navigateur est coordonnée par Pubnub.

Le service PUBNUB fournit non seulement l'interaction de tous les composants nécessaires pour établir une communication entre les navigateurs homologues à pair afin d'échanger des messages en temps réel, mais leur fournit également un réseau mondial de diffusion de données.

Pour utiliser la plate-forme Pubnub pour créer une chat vidéo, tout d'abord, vous devez vous inscrire sur Pubnub afin de créer un compte gratuit. L'utilisateur enregistré a la capacité d'obtenir des clés API s'abonner_key. et publish_key.nécessaire pour développer une demande de communication pubnub. Ensuite, dans votre compte, vous pouvez ajouter des fonctionnalités telles que la sécurité, la présence et le stockage.

Après avoir reçu l'API des touches, vous pouvez commencer à créer une application de communication basée sur la plate-forme PUBNUB à l'aide de SDK sur l'une des principales langues de programmation ou utilisez des applications de démonstration (modèles). Un manuel de création d'une application de communication est représenté à la page: https://www.pubnub.com/docs/tatudials/pubnub-publish-Subscribe. Le guide de discussion vidéo basé sur la vidéo de Pubnub Webrtc SDK est pris en compte sur https://www.pubnub.com/docs/webrtc-javascript/pubnub-javascript-sdk.

Pour créer une chat vidéo WEBRTC à partir de zéro conformément au manuel, vous devez appliquer quelques API simples pour JavaScript:

  • connectez la bibliothèque Pubnub dans la page HTML, c'est-à-dire Activer JavaScript Pubnub SDK dans la page de code HTML avant l'initialisation du client;
  • init () - initialiser l'API client PUBNUB;
  • abonnez-vous () - Abonnez-vous à un canal spécifique (appelez la méthode Subscribe () Pubnub API);
  • publier () - Envoyer un message à un canal spécifique (appelez la méthode Publish () Pubnub API);
  • se désabonner () - Refuser de s'abonner à un canal spécifique.

L'initialisation de l'API client PUBNUB peut être représentée comme suit:
var pubnub \u003d pubnub.init ((
Publish_key: "Votre clé de publication",
Subscribe_key: "Votre clé d'inscription"
});

Pour créer un chat vidéo WEBRTC basé sur PUBNUB WEBRTC, vous pouvez utiliser le modèle Open Source: https://www.pubnub.com/developers/demos/webrtc/. Pour vérifier le fonctionnement de cette chat vidéo, vous devez contacter l'adresse spécifiée à partir de deux ordinateurs, dans l'interface de discussion vidéo qui s'ouvre dans les navigateurs, les numéros de téléphone sont attribués au téléphone. Pour la communication, les utilisateurs doivent entrer les numéros de téléphone dans le champ de texte "Type destinataire" et cliquer sur le bouton avec l'image du combiné.

En conséquence, l'image des caméscopes adulte dans les navigateurs et affichée sur les écrans des moniteurs. De plus, cette chat vidéo effectue des fonctions de discussion pour la transmission de texte. Pour la correspondance, les utilisateurs doivent entrer du texte dans le champ "Discuter ici" et appuyer sur la touche Entrée. La figure 4 montre la capture d'écran de chat vidéo utilisateur avec un numéro de téléphone 164.



Figure. 4.Pubnub avec WEBRTC.

La figure 5 montre la capture d'écran de chat vidéo utilisateur avec un numéro de téléphone 128.



Figure. 5.Pubnub avec WEBRTC.

Conçu pour l'interface utilisateur, l'application de communication Web est conçue à l'aide du balisage HTML5 et de l'hypertexte CSS3. La partie client de l'application de communication est conçue pour JS. Les bibliothèques ont été connectées à l'application de communication Web: JQuery, Pubnub JavaScript SDK et Pubnub WEBRTC SDK.

Les utilisateurs du réseau européen ont été divisés en deux parties: Selon une enquête de l'Institut d'analyse publique de l'opinion publique à Allenbach (Allemagne), Skype, Chat et Systems Memory Systems sont devenus une partie intégrante de la vie quotidienne de 16,5 millions d'adultes et d'enfants, 9 Des millions d'utilisent ces services à partir de cas d'occasion et 28 millions n'ont pas été touchés.

La situation peut changer, car maintenant dans Firefox intégré technologie de communication en temps réel (Webrtc.), ainsi que le client lui-même. Démarrez le chat audio et vidéo maintenant plus difficile que d'ouvrir le site. Des services tels que Facebook et Skype parient sur des solutions à l'aide d'un client séparé et créant un compte.

WEBRTC diffère non seulement par la simplicité. Cette méthode vous permet même d'installer connexion directe entre deux navigateurs. Ainsi, les données audio et vidéo ne transmettent pas le serveur où la surcharge peut se produire ou dont l'administrateur n'est pas particulièrement scrupuleux par rapport au secteur privé ou à la protection des données. Grâce à la connexion directe pour WEBRTC, ni enregistrement ni compte dans aucun service n'est nécessaire.

Pour démarrer la conversation, vous n'avez besoin que de passer par le lien. La communication reste privéePuisque le flux de données est crypté. Communication En temps réel à travers le navigateur, Google a commencé à s'engager activement en 2011, lorsque et publié le code source de son implémentation de la WEBRTC.

Peu de temps après, Chrome et Firefox ont reçu leurs propres moteurs WEBRTC. Actuellement, leurs options mobiles sont équipées de cette technologie et installées avec Android 5.0 par le moteur WebView 3.6, qui est utilisée par les applications.

Pour les communications en temps réel, les interfaces JavaScript appropriées doivent être implémentées dans la visionneuse Web. Avec l'aide de GetTusermedia, le logiciel active la capture des sources audio, issues d'une webcam et d'un microphone. RTCPEerconnection est responsable de l'établissement d'une connexion, ainsi que de la communication elle-même.

Parallèlement à l'intégration dans le navigateur, le groupe de travail du World Wide Web Consortium (W3C) a forcé le processus de normalisation de la WEBRTC. Il doit être achevé en 2015.

Webrtc est satisfait de petit

Pour utiliser le service WEBRTC, de nombreuses ressources ne sont pas nécessaires, car le serveur connecte uniquement les interlocuteurs. L'installation du composé ne représente pas non plus une complexité particulière. Premièrement, le navigateur sert le signal WEBRTC au signal qu'il prévoit de lancer un appel. Sur le serveur, il reçoit un lien HTTPS - la connexion est effectuée sous une forme cryptée. Cet utilisateur de lien envoie son interlocuteur. Après cela, le navigateur demande à l'utilisateur d'accéder à la webcam et au microphone.

Pour définir le streaming direct avec l'interlocuteur, le navigateur reçoit ses données d'adresse IP et de configuration du service WEBRTC. Le visualiseur Web de l'interlocuteur entre de la même manière.

Pour diffuser la fonction de connexion sans échec et de bonne qualité, trois moteurs fonctionnent dans le navigateur. Deux d'entre eux optimisent et compressent des données vidéo audio, le troisième est responsable de leur transport. Il transfère les données à travers protocole SRTP (Protocole de transport en temps réel sécurisé), ce qui vous permet d'effectuer des streaming cryptés en temps réel.

Si la connexion directe ne peut pas être installée, WEBRTC recherche un autre chemin. Par exemple, cela se produit lorsque les paramètres réseau empêchent le serveur étonnant de fournir une adresse IP. La norme de la WEBRTC prévoit que, dans ce cas, la conversation aura lieu, mais avec le tournant intermédiaire sur le serveur TURN (trershasal à l'aide de relais autour de NAT). Donc, sur le site Web NetScan.co, vous pouvez vérifier si la WEBRTC est implémentée sur votre ordinateur et avec votre accès réseau.

Comment se connecter

Vous devez d'abord enregistrer une conversation (1). WEBRTC Service donne un lien à envoyer à l'interlocuteur. Le navigateur utilisant le Stunner découvre sa propre adresse IP (2), l'envoie au service et reçoit un partenaire IP pour installer le composé direct (3). Si vous ne pouvez pas utiliser l'étourdissement, la conversation est redirigée à l'aide du serveur de serrage (4).

La communication sur la technologie WEBRTC dans le navigateur est lancée à l'aide du code JavaScript. Après cela, trois moteurs sont responsables de la communication: les lecteurs de la voix et des vidéos collectent des données multimédia à partir d'une webcam et d'un microphone, et le moteur de transport allie des informations et transfère le flux de formulaire crypté à l'aide du protocole SRTP (protocole en temps réel sécurisé).

Quels navigateurs travaillent avec webrtc

Chrome et Firefox sont équipés d'un moteur WEBRTC qui utilise de tels services comme Talky.IO. Mozilla Navigateur peut travailler directement avec son propre client.

Google et Mozilla continuent de développer une idée de communication en temps réel: Chrome peut organiser une conférence WEBRTC avec plusieurs participants et le nouveau client Hello de Firefox est conçu avec la filiale du géant Telefonica Télécommunication. Apple est encore resté de côté, dans Safari Webrtc à ne pas encore attendre. Cependant, il existe de nombreuses applications alternatives pour iOS et plug-ins pour safari.

Microsoft est quelque peu différent. En tant que propriétaire du service compétitif Skype, cette entreprise ne sera pas si facile à capituler avant WEBRTC. Au lieu de cela, Microsoft développe une technologie appelée ORTC (Object Real-Time Communications) pour Internet Explorer.

De telles différences de WEBRTC, comme d'autres codecs et protocoles d'établissement de contacts avec le serveur, sont insignifiantes et au fil du temps, suscitant probablement une addition à la norme WEBRTC, qui comprendra ces divergences. Ainsi, à la mer seulement, la pomme reste - comme d'habitude.

Photo:fabricants; Goodluz / fotolia.com.

Bonjour les amis, comme vous le savez déjà, nous vous informons régulièrement de nouvelles technologies, aujourd'hui, je vais présenter WEBRTC, une technologie développée par Google, qui permet aux utilisateurs de parler directement dans le navigateur vidéo et audio sans exiger que l'utilisation de sites Web ou d'applications audio . La vidéo et la connexion directe audio entre les utilisateurs sont effectuées directement dans le navigateur.
La technologie WEBRTC est prise en charge dans Mozilla Firefox Google Chrome Browersers et sur tout système d'exploitation rejoindre bientôt l'opéra.
Qu'est-ce que webrtc et quoi?
WEBRTC court pour la communication sur le temps réel Web, cette technologie vous permet d'ouvrir des chats audio et vidéo directement dans le navigateur sans avoir besoin d'autres plug-ins, applications ou services sur Internet pour cela. La connexion est effectuée directement à partir du navigateur dans le navigateur.
Si des services connus (Skype, Yahoo Messenger, Apple FaceTime, Google Hago, etc.) nécessitent un serveur qui connecte les utilisateurs à lancer et à gérer le trafic. En utilisant ces services, nous devons enregistrer et installer une liste de clients et de contacts.
Avec WEBRTC, nous n'avons pas besoin de serveurs, d'applications ou de serveurs connectés à Intermittent.
Avantages WEBRTC:
1. Aucune autre demande qui consomme l'utilisation des ressources et des piles.
2. Dans les salles de discussion plus privées (relativement).
3. Comment contacter peut être effectué au niveau local et non aux serveurs US Flos pour les connexions locales.
4. Facile, facilité d'utilisation.
5. La possibilité de développement ultérieur et dans d'autres directions.
6. La communication est stable et ne dépend pas des composés externes parfois extrêmement instables.
Dans le manuel, j'ai utilisé une démonstration que les personnes de Google se sont développées, cette démo est assez simple, des fonctionnalités plus avancées et des connexions plus rapides peuvent utiliser l'une des applications prenant en charge la WEBRTC, elles sont plus faciles à utiliser. Bientôt, nous ferons un manuel et des applications WEBRTC.
Comment utiliser la démo Webrtc?
Très simplement cliquez sur le lien ci-dessous, il génère automatiquement un chat. Attachez cette pièce, vous devez envoyer un ami / petite amie que vous souhaitez entrer en contact.
Ami / ami et le vôtre, mais vous devez utiliser uniquement les dernières versions de Mozilla Firefox ou de Google Chrome.

Démo Webrtc. (Audio de chat d'introduction - Vidéo)

Attention:
La démo n'est pas très stable, elle n'est faite que pour la démonstration. Il peut être utilisé pendant une période limitée pendant laquelle les petites erreurs peuvent avoir un composé.
Si vous avez des connexions avec connexion, essayez de créer une autre conversation.

WEBRTC vous permet de mettre en œuvre une communication audio / vidéo en temps réel via navigateur

Dans ce sujet, je vais vous dire comment mettre en œuvre l'application WEBRTC la plus simple.

1. Get Mustermedia - Accédez aux périphériques multimédias (microphone / webcam)

Rien de compliqué, avec l'aide de 10 rangées de code JavaScript, vous pouvez voir et vous entendre dans le navigateur (démo).

Créer index.html :

Vous pouvez appliquer des filtres CSS3 à l'élément vidéo.

Il saisit ici que, à ce stade de développement, je ne peux pas dire au navigateur "Ce site que j'ai confiance, le permet toujours d'accéder à mon appareil photo et à mon microphone" et vous devez appuyer sur Autoriser après chaque page d'ouverture / mise à jour.

Eh bien, il ne sera pas superflu que si vous donnez accès à la caméra dans un navigateur, l'autre lorsque vous essayez d'accéder recevra une autorisation_dentier.

2. Signaling Server (Signal Server)

Ici, je violais la séquence de la plupart des instructions "WEBRTC MISE ENTRAÎNEMENT" car elles sont en deuxième étape pour démontrer les capacités de WEBRTC sur un client, qui vient d'être confus à l'explication.

Le serveur de signal est un centre Webrtc de coordination, qui fournit une communication entre les clients, l'initialisation et la fermeture de la connexion, des rapports d'erreur.

Signal Server Dans notre cas, c'est nœud.js + socket.io + nœud-statique, il écoute le port 1234.
De plus, le nœud statique peut donner Index.html, qui rendra notre application aussi simple que possible.

Dans le dossier d'application, vous allez installer le nécessaire:

NPM Installation socket.io NPM Installez le nœud statique