webrtc sur.gdgdevfest.com - @dperilla
DESCRIPTION
Presentación sobre WebRTC en el Google Developer Fest Sur celebrado en Córdoba (España) el 31 de Octubre de 2013.TRANSCRIPT
Web 3.0: WebRTC
David Muñoz Padín @dperilla
¿Quién soy?• David Muñoz - CEO Quaip - @dperilla
• VoipEngineer con Asterisk / Kamailio desde 2003
• SysAdmin Linux desde 1999
• Formador online de Asterisk, Virtualización y Linux desde 2007
• Coworker en @Cosfera desde Mayo de 2013
· Desarrollo e infraestructuras avanzadas de Voip !
· Sistemas avanzados de E-learning !
· Servidores de streaming de radio y TV
· Web Hosting Avanzado, VPS y Servidores Dedicados!· Housing !
· Clientes en USA, UK, Venezuela y España
Fase actual: Pruebas de vueloReady to fly in 2014
WebRTC
Pero.. ¿Qué es WebRTC?
!
• Comunicación directa entre navegadores web
• Comunicaciones en tiempo real
• Sencillas APIS Javascript!
• Especificación de HTML5!
• Proyecto Libre y Abierto, liberado por Google.!
• Skype en la web
Pero.. ¿Qué es WebRTC?
Navegadores soportados• Escritorio!
• Google Chrome 23
• Mozilla Firefox 22
• Opera 12
• Android!
• Google Chrome 28
• Mozilla Firefox 24
• Opera Mobile 12
• Google Chrome OS!
• Firefox OS!
• Próximamente Aplicaciones nativas
Evolución de WebRTCMillones de dispositivos
0
1000
2000
3000
4000
2012 2013 2014 2015
PCs Smartphones Tablets
Fuente: Disruptive Analysis WebRTC Strategy Report. Feb 2013
El camino hacia WebRTC
Fuente: jimmylee.info
• API desarrollada por:
• W3C (APIS para aplicaciones web)
• IETF (Protocolos y formatos)
• Plugin Free. #noflashplayer #nosilverlight !
• Soportado por Google, Mozilla y Opera
• Protocolo en estado de arte
Algunos Datos
• MediaStream (getUserMedia) !
• Permite a un navegador web acceder a la cámara y el micrófono!
!
• RTCPeerConnection!
• Establece la comunicación de audio / vídeo!
!
• RTCDataChannel!
• Permite a los navegadores compartir datos a través de P2P
WebRTC APIs principales
getUserMedia !!var constraints = {video: true}; !function successCallback(localMediaStream) { var video = document.querySelector("video"); video.src = window.URL.createObjectURL(localMediaStream); } !function errorCallback(error){ console.log("navigator.getUserMedia error: ", error); } !navigator.getUserMedia(constraints, successCallback, errorCallback); !
https://simpl.info/getusermedia/
http://idevelop.ro/ascii-camera/
http://shinydemos.com/facekat/
www.webcamtoy.com
Compartir Escritorio
pc = new RTCPeerConnection(null); pc.onaddstream = gotRemoteStream; pc.addStream(localStream); pc.createOffer(gotOffer); !function gotOffer(desc) { pc.setLocalDescription(desc); sendOffer(desc); } !function gotAnswer(desc) { pc.setRemoteDescription(desc); } !function gotRemoteStream(e) { attachMediaStream(remoteVideo, e.stream); }
RTCPeerConnection
simpl.info/pc
var pc = new webkitRTCPeerConnection(servers, {optional: [{RtpDataChannels: true}]}); !pc.ondatachannel = function(event) { receiveChannel = event.channel; receiveChannel.onmessage = function(event){ document.querySelector("div#receive").innerHTML = event.data; }; }; !sendChannel = pc.createDataChannel("sendDataChannel", {reliable: false}); !document.querySelector("button#send").onclick = function (){ var data = document.querySelector("textarea#send").value; sendChannel.send(data); };
RTCDataChannel
simpl.info/dc
sharefest.me
WebRTC vs Voip
Fuente: ramonmillan.com
Característica Voip WebRTC
Señalización SIP y H.323 (principalmente) Sin definir
Medios RTP/RTCP RTP/RTCP
Codecs de voz Serie G.7xxx (principalmente) G.711 y Opus
Codecs de vídeo H.263, H.264 VP8
Seguridad de los medios SRTP/TLS/IPsec SRTP
SIP over WebRTC
• Draft IETF: websockets draft-ietf-sipcore-sip-websockets. (Iñaki Baz, J.L. Millán, …) !
• Señalización SIP enviada vía websockets !
• Ejemplos de Uso: JSSIP, SIPML5
sipml5.org
Codecs soportados (A fecha de hoy)
• Audio!• Opus • G.711 • iLBC • iSAC
• Video!• VP8 • ¿H.264?
Codecs War (Octubre 2013)
Patrocinadores de VP8
Patrocinadores de H.264
Ericsson Nokia
BlackBerry Qualcomm
Orange Cisco
Microsoft Apple
Fuente: webrtchacks.com
Opus Codec• Codec abierto y libre
• Desarrollado por IETF
• Bit-rates desde 6 kb/s a 510 kb/s
• Frecuencias de muestreo desde 8 kHz (narrowband) a 48 kHz (fullband)
• Soporta bit-rate constante (CBR) y bit-rate variable (VBR)
• Basado en ILK de Skype y CELT de xiph.org
VP8• Codec Abierto liberado por Google
• Parte de WebM: junto con el codec de audio Vorbis y dentro de un contenedor Matroska.
• High Quality
• Optimizado para Real Time
• Usado por Google Hangouts HD!
• Soportado en Firefox, Chrome y Opera.
Sin NAT
Con NAT
Soluciones al NAT
• STUN
• TURN
• ICE
STUN
• permite a clientes NAT encontrar su dirección IP pública!
• Económico
• Datos van por directamente P2P
• permite solucionar problemas de NAT donde STUN no puede!
• Caro
• Los datos pasan por el servidor y usa su ancho de banda
TURN
• Un framework para buscar la mejor solución
• Si puede usará STUN, si no puede TURN
• La mayoría de las llamadas irán por STUN
ICE
• stun.l.google.com:19302
• WebRTC stunserver, turnserver
• rfc5766-turn-server
• restund
Desplegando STUN/TURN
Seguridad en WEBRTC
P2P: Uno a Uno
Malla
Estrella
Media Server
¿Podemos ver algunos ejemplos?
talky.io/quaip
twelephone.com
Gracias a la
organización de GDG DevFest Sur
¿Preguntas?