Retour sur la DotJs 2015 - Real World WebRTC

Cette fois-ci, parlons du talk d'Eric Schoffstall.

Si ce nom ne vous dit, peut-être que GulpJs vous parlera un peu plus ? Car il est en effet à l'origine de cet outils que nous utilisons à longueur de temps.

Et il nous a exposé la problématique qu'il a eu depuis la fin 2014: une application WebRTC. Le but: rendre accessible via une API le protocole RTC dans son navigateur. Autrement dit, pouvoir faire un tchat vidéo par exemple.

Même si à l'heure actuelle, le WebRTC est compatible sous Chrome, les dernières versions d'Android et de Firefox, il y a un an, ce n'était pas vraiment le cas. En effet, il y a un an, seul Chrome proposait un vrai support. Et faire une application WebRTC qui ne fonctionne que sous Chrome n'est pas une application, c'est un prototype.



Du coup, il s'est posé la question: que faut-il faire pour avoir une application WebRTC qui soit uniforme et consistant sur tous les navigateurs / devices ?
  • Faut-il utiliser des adapteurs ? Voir des plugins ?
  • Faut-il utiliser des polyfills ? Autrement, un bout de code JavaScript qui puisse "simuler" WebRTC.
  • Existe-t-il des APIs spécifiques pour chaque navigateur / plateforme ?
  • Et que sera donc au final le support des différentes plateformes / navigateurs.

Et à toutes ces questions, Eric a résumé cela en une phrase:

"WebRTC is a cool vision, but WebRTC is difficult"



Il a donc commencé par chercher comment faire fonctionner cela sous Firefox ou Internet Explorer. Il a pour utilisé un plugin / polyfill qui se nomme Temasys. Il semblerait que ce plugin soit plutôt simple de mise en oeuvre. Le "hic" est qu'il faut des adapteurs en fonction de Windows et de Mac.

Néanmoins, avec la vélocité des mises à jour des navigateurs, nous pouvons compter pour Firefox / Opera une mise en place de WebRTC. Il reste toujours le cas d'Internet Explorer (oups, je voulais dire Edge ...).


Du côté de la mobilité, c'est très galère. Android supporte récemment WebRTC. Mais même sous Android 4.x, il n'y a pas une uniformité. Pour cela, il a utilisé "crosswalk" (qui fonctionne désormais sous iOS aussi) et qui permet d'activer WebRTC. En revanche, cela demande de créer des applications hybrides. Pour des applications Web mobiles, il faut toujours utiliser des versions récentes d'Android.

Pour iOS, c'est encore pire: nous ne pouvons passer que par une application hybride. Mais en plus, le plugin "phare" permettant de faire cela est plutôt compliqué et à des effets de bords: iosRTC. Car il semblerait que ce plugin place au dessus de la zone où est censé s'afficher la vidéo via WebRTC est un composant natif. Cela implique une taille figée, une position maîtrisée, etc ...


Face à tout cela, il a décidé de nous aider en nous fournissant une API "rtc-everywhere".



Ce dernier fonctionne simplement, et est disponible pour:
  • Les navigateurs
    • Chrome
    • Firefox
    • Safari 7+
    • Internet Explorer 9+
    • Edge

  • Les mobiles
    • Android 4+ et 5+
    • iOS

  • Et aussi NodeJs


Et pour illustrer ça, il a fait un petit site qui l'utilise: http://cachemonet.com/



Nous pouvons donc lui dire merci de ce grand retour d'expérience, mais aussi de son framework :)

Commentaires

Enregistrer un commentaire

Posts les plus consultés de ce blog

ISO: liens & outils utiles

Image
Voici quelques normes ISO à connaître et que vous aurez à faire face dans vos développements. Et quelques liens / outils permettant de s'assurer que nous faisons correctement leurs intégrations Code Pays https://countrycode.org/ est super site qui permet de lister les pays du monde avec leur country code (en mode number et iso): Et par pays, nous pouvons avoir des informations supplémentaires, comme le format téléphone, la position géographique, la time zone, la monnaie, etc: Ce site du coup regroupe les country code: En ISO 3166 name (où un nom est attribué à un pays) En ISO 3166 numeric (où un chiffre numérique est attribué à un pays) En ISO 3166-1 alpha-2 (code en 2 alpha majuscule) En ISO 3166-1 alpha-3 (code en 3 alpha majuscule) Ainsi que les langues. Tout cela est d'ailleurs regroupés dans ce fichier téléchargeable . Code langue / locale Là, nous tombons dans un des plus grands soucis d'un développeur: co...
Lire la suite

NodeJs et SSL: une petite analyse

Le but de cet article est de faire un petit tour d'horizon de l'usage de SSL dans nos applications NodeJs, en l'occurence, quand nous souhaitons faire une application Web, une API REST, ou les deux. Nous allons avoir 6 étapes pour de réalisation d'un serveur NodeJs, avec à chaque fois 12 clients: Un client NodeJs sans certificats SSL - strictSSL à false Un client NodeJs sans certificats SSL - strictSSL à true Un client NodeJs avec un certificat SSL client non fiable - strictSSL à false Un client NodeJs avec un certificat SSL client non fiable - strictSSL à true Un client NodeJs avec un certificat SSL server non fiable - strictSSL à false Un client NodeJs avec un certificat SSL server non fiable - strictSSL à true Un client NodeJs avec un certificat SSL client fiable - strictSSL à false Un client NodeJs avec un certificat SSL client fiable - strictSSL à true Un client NodeJs avec un certificat SSL serveur fiable - strictSSL à false...
Lire la suite

Créer sa commande slack en quelques minutes

Image
Le but de cet article est de vous montrer que très simplement, nous pouvons créer une commande personnalisée pour Slack. Ici, nous allons afficher des chats :)" Tout d'abord, nous allons nous créer des comptes sur: Slack:  https://slack.com Heroku:  http://www.heroku.com/ qui permettra d'héberger notre service REST pour Slack Gitlab: https://gitlab.com  qui permet évidemment d'héberger notre code, mais qui pourra de manière automatiser déployer notre application sur Heroku à chaque commit (et cela, même en mode "gratuit") Concentrons-nous tout d'abord sur Heroku et Gitlab. Créons un compte Heroku. Une fois cela fait, aller dans votre compte :. Vous verrez alors une section nommée "API key": Cliquez sur "Reveal" pour voir la valeur et conservez la bien en mémoire. Ensuite, sur en retournant sur votre dashboard d'applications Heroku , cliquez sur "New" et créez une nouvelle application. Dans...
Lire la suite