SlideShare una empresa de Scribd logo
1 de 22
José Luis Millán
Iñaki Baz Castillo
¿ Qué es WebRTC ?
●

Comunicación en tiempo real para la Web

●

WebRTC Media
–

●

Características del media transmitido

WebRTC API
–

API JavaScript para browsers
WebRTC Media
●

Características y requerimientos del media transmitido
–

RTP audio/vídeo

–

DataChannel (new)
●

●

Envío y recepción de datos custom en tiempo real

Codecs MTI (Must To Implement)
–

Audio: Opus, Alaw, Ulaw

–

Vídeo: VP8, H.264 (no decidido)
WebRTC Media
●

Establecimiento de media
–

–
●

Ambos peers encuentran el camino más rápido para transmitir media
de uno a otro
ICE / STUN / TURN

Seguridad
–

RTP audio/vídeo encriptado con DTLS-SRTP

–

DataChannel encriptado con DTLS (SCTP sobre DTLS sobre UDP)

–

Media Consent (ICE garantiza que transmitimos media al destino
correcto)
WebRTC Media
●

¿Quién debe/puede implementar todos estos requisitos?
–

Desktop Browsers (Chrome, Firefox, Internet Explorer, Opera...)
●

¿ Smartphone Browsers ? mmm...

–
–
●

Apps en smartphones y tablets
Servidores (Asterisk, FreeSwitch, Google Hangouts...)

Interoperabilidad a nivel de media entre distintos dispositivos
–

NOTA: Nadie ha hablado aún de señalización
WebRTC API
●

API JavaScript para browsers
–

getUserMedia(): solicitar permisos de micrófono y/o webcam

–

RTCPeerConnection: Clase JavaScript para iniciar una sesión
WebRTC con otro peer
●

Envío y recepción de múltiples MediaStream de audio/vídeo

●

DataChannel para envío y recepción de datos custom
WebRTC API
●

SDP Offer/Answer
–

API WebRTC para solicitar un SDP a nuestro browser
●

–

Recibimos el SDP del peer remoto
●

●

Y se lo enviamos al peer remoto
Y lo usamos a través del API WebRTC

¿Cómo transmitimos y recibimos el SDP?
–

WebSocket
●

SIP over WebSocket

●

XMPP/Jingle over WebSocket

●

Lo-que-sea over WebSocket

–

HTTP AJAX (para no recargar la página)

–

WebRTC no impone el tipo de de señalización en red
WebRTC F.A.Q.
Casos de Uso WebRTC
●

Póker online
–

●

ChatRoulette
–

●

¿Sólo Web?

Puesto de callcenter
–

●

Enseñemos nuestras partes íntimas, ¡pero sin Flash!

Un nuevo “Skype”
–

●

Nadie “llama” a nadie

¡Plugin para Asterisk!

Telefonía doméstica
–

mmm...
Casos de Uso WebRTC
●

Hacer feliz a tu abuela

¡¡¡ DEMO !!!
RetroRTC

●

http://retrortc.versatica.com
Arquitectura RetroRTC
SIP over WebSocket
SIP over UDP/TCP
ICE
RTP

PSTN
Proyectos Relacionados
●

http://jssip.net

●

http://oversip.net
Muchas Gracias
●

A los asistentes

●

A Avanzada7 por organizar el VOIP2DAY
–

●

(el mejor evento de VoIP de Europa)

A todos los que lo hacen posible

@ibc_tw
@jomivi

Más contenido relacionado

La actualidad más candente

Vnc final
Vnc finalVnc final
Vnc final
caoxman
 
Soluciones SIP Carrier Class con OpenSIPS
Soluciones SIP Carrier Class con OpenSIPSSoluciones SIP Carrier Class con OpenSIPS
Soluciones SIP Carrier Class con OpenSIPS
Alejandro Rios Peña
 
Docker como la máxima expresión de Devops - WISIT 2015
Docker como la máxima expresión de Devops - WISIT 2015Docker como la máxima expresión de Devops - WISIT 2015
Docker como la máxima expresión de Devops - WISIT 2015
Gustavo Andres Brey
 

La actualidad más candente (20)

Introducción a Docker
Introducción a DockerIntroducción a Docker
Introducción a Docker
 
Vnc final
Vnc finalVnc final
Vnc final
 
Guía de configuracion Openvpn
Guía de configuracion OpenvpnGuía de configuracion Openvpn
Guía de configuracion Openvpn
 
Documentacion vnc
Documentacion vncDocumentacion vnc
Documentacion vnc
 
Dockeriza tu entorno de desarrollo
Dockeriza tu entorno de desarrolloDockeriza tu entorno de desarrollo
Dockeriza tu entorno de desarrollo
 
Solapas principales Ver(solapa activa) Editar Gestionar present...
 Solapas principales      Ver(solapa activa)     Editar     Gestionar present... Solapas principales      Ver(solapa activa)     Editar     Gestionar present...
Solapas principales Ver(solapa activa) Editar Gestionar present...
 
World Wide SIP
World Wide SIPWorld Wide SIP
World Wide SIP
 
Docker meetup :: Kubernetes en Restorando
Docker meetup :: Kubernetes en RestorandoDocker meetup :: Kubernetes en Restorando
Docker meetup :: Kubernetes en Restorando
 
Fury - Docker Meetup
Fury - Docker MeetupFury - Docker Meetup
Fury - Docker Meetup
 
Introduccion a kata containers
Introduccion a kata containersIntroduccion a kata containers
Introduccion a kata containers
 
Nuevo QNAP SO QTS 4.2 en Español
Nuevo QNAP SO QTS 4.2 en EspañolNuevo QNAP SO QTS 4.2 en Español
Nuevo QNAP SO QTS 4.2 en Español
 
Introducción a Vagrant
Introducción a VagrantIntroducción a Vagrant
Introducción a Vagrant
 
Creación de entornos de desarrollo con Vagrant
Creación de entornos de desarrollo con VagrantCreación de entornos de desarrollo con Vagrant
Creación de entornos de desarrollo con Vagrant
 
Vagrant para automatizar entornos DEV/PRO: VirtualBox y vSphere
Vagrant para automatizar entornos DEV/PRO: VirtualBox y vSphereVagrant para automatizar entornos DEV/PRO: VirtualBox y vSphere
Vagrant para automatizar entornos DEV/PRO: VirtualBox y vSphere
 
Athento Runtime
Athento RuntimeAthento Runtime
Athento Runtime
 
Entornos de desarrollo para symfony2 con vagrant y puppet
Entornos de desarrollo para symfony2 con vagrant y puppetEntornos de desarrollo para symfony2 con vagrant y puppet
Entornos de desarrollo para symfony2 con vagrant y puppet
 
Soluciones SIP Carrier Class con OpenSIPS
Soluciones SIP Carrier Class con OpenSIPSSoluciones SIP Carrier Class con OpenSIPS
Soluciones SIP Carrier Class con OpenSIPS
 
Docker como la máxima expresión de Devops - WISIT 2015
Docker como la máxima expresión de Devops - WISIT 2015Docker como la máxima expresión de Devops - WISIT 2015
Docker como la máxima expresión de Devops - WISIT 2015
 
Vnc presentación
Vnc presentaciónVnc presentación
Vnc presentación
 
Docker - Sysmana 2014
Docker - Sysmana 2014Docker - Sysmana 2014
Docker - Sysmana 2014
 

Similar a [VoIP2Day 2013] Si sólo ves un webphone no entiendes WebRTC

voip2day 2012 - Js sip sip + webrtc (el futuro ya esta aqui) by iniaki baz y ...
voip2day 2012 - Js sip sip + webrtc (el futuro ya esta aqui) by iniaki baz y ...voip2day 2012 - Js sip sip + webrtc (el futuro ya esta aqui) by iniaki baz y ...
voip2day 2012 - Js sip sip + webrtc (el futuro ya esta aqui) by iniaki baz y ...
VOIP2DAY
 
Webinar WebRTC y HTML5 (spanish) - Quobis
Webinar WebRTC y HTML5 (spanish) - QuobisWebinar WebRTC y HTML5 (spanish) - Quobis
Webinar WebRTC y HTML5 (spanish) - Quobis
Quobis
 
Conceptos sobre Streaming
Conceptos sobre StreamingConceptos sobre Streaming
Conceptos sobre Streaming
Francesc Perez
 
Negociacion de Codecs en Asterisk
Negociacion de Codecs en AsteriskNegociacion de Codecs en Asterisk
Negociacion de Codecs en Asterisk
Moises Silva
 

Similar a [VoIP2Day 2013] Si sólo ves un webphone no entiendes WebRTC (20)

[4K Conf 2012] SIP y WebRTC para Seres Humanos (tm)
[4K Conf 2012] SIP y WebRTC para Seres Humanos (tm)[4K Conf 2012] SIP y WebRTC para Seres Humanos (tm)
[4K Conf 2012] SIP y WebRTC para Seres Humanos (tm)
 
JsSIP: SIP + WebRTC (el futuro está aquí)
JsSIP: SIP + WebRTC (el futuro está aquí)JsSIP: SIP + WebRTC (el futuro está aquí)
JsSIP: SIP + WebRTC (el futuro está aquí)
 
voip2day 2012 - Js sip sip + webrtc (el futuro ya esta aqui) by iniaki baz y ...
voip2day 2012 - Js sip sip + webrtc (el futuro ya esta aqui) by iniaki baz y ...voip2day 2012 - Js sip sip + webrtc (el futuro ya esta aqui) by iniaki baz y ...
voip2day 2012 - Js sip sip + webrtc (el futuro ya esta aqui) by iniaki baz y ...
 
[VoIP2Day 2012] World Wide SIP
[VoIP2Day 2012] World Wide SIP[VoIP2Day 2012] World Wide SIP
[VoIP2Day 2012] World Wide SIP
 
Webinar WebRTC y HTML5 (spanish) - Quobis
Webinar WebRTC y HTML5 (spanish) - QuobisWebinar WebRTC y HTML5 (spanish) - Quobis
Webinar WebRTC y HTML5 (spanish) - Quobis
 
Iba2008 Servicios
Iba2008 ServiciosIba2008 Servicios
Iba2008 Servicios
 
IP-TV.pptx
IP-TV.pptxIP-TV.pptx
IP-TV.pptx
 
Conceptos sobre Streaming
Conceptos sobre StreamingConceptos sobre Streaming
Conceptos sobre Streaming
 
Negociacion de Codecs en Asterisk
Negociacion de Codecs en AsteriskNegociacion de Codecs en Asterisk
Negociacion de Codecs en Asterisk
 
Negociacion de codecs en asterisk
Negociacion de codecs en asteriskNegociacion de codecs en asterisk
Negociacion de codecs en asterisk
 
WebRTC en tu web con OpenVidu
WebRTC en tu web con OpenViduWebRTC en tu web con OpenVidu
WebRTC en tu web con OpenVidu
 
Internet protocol-television
Internet protocol-televisionInternet protocol-television
Internet protocol-television
 
Extendiendo SIP con WebRTC
Extendiendo SIP con WebRTCExtendiendo SIP con WebRTC
Extendiendo SIP con WebRTC
 
Extendiendo SIP con WebRTC - Saúl Ibarra | VoIP2DAY 2015
Extendiendo SIP con WebRTC - Saúl Ibarra | VoIP2DAY 2015Extendiendo SIP con WebRTC - Saúl Ibarra | VoIP2DAY 2015
Extendiendo SIP con WebRTC - Saúl Ibarra | VoIP2DAY 2015
 
Más allá de conferencias | IÑAKI BAZ - VoIP2DAY 2017
Más allá de conferencias | IÑAKI BAZ - VoIP2DAY 2017Más allá de conferencias | IÑAKI BAZ - VoIP2DAY 2017
Más allá de conferencias | IÑAKI BAZ - VoIP2DAY 2017
 
Scati resumen de capacidades
Scati   resumen de capacidadesScati   resumen de capacidades
Scati resumen de capacidades
 
Scati resumen de capacidades
Scati   resumen de capacidadesScati   resumen de capacidades
Scati resumen de capacidades
 
Sipml5 to Elastix
Sipml5 to ElastixSipml5 to Elastix
Sipml5 to Elastix
 
SIPML5toElastix
SIPML5toElastixSIPML5toElastix
SIPML5toElastix
 
Ajax reverse (Comet) con ASP.NET MVC - JUTI 2011
Ajax reverse (Comet) con ASP.NET MVC - JUTI 2011Ajax reverse (Comet) con ASP.NET MVC - JUTI 2011
Ajax reverse (Comet) con ASP.NET MVC - JUTI 2011
 

Último

Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
AnnimoUno1
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
FagnerLisboa3
 

Último (15)

Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
 
Presentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmerilPresentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmeril
 
presentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptxpresentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptx
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Joseph
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
 
Desarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfDesarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdf
 
Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnología
 
Presentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxPresentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptx
 

[VoIP2Day 2013] Si sólo ves un webphone no entiendes WebRTC

  • 2. ¿ Qué es WebRTC ? ● Comunicación en tiempo real para la Web ● WebRTC Media – ● Características del media transmitido WebRTC API – API JavaScript para browsers
  • 3. WebRTC Media ● Características y requerimientos del media transmitido – RTP audio/vídeo – DataChannel (new) ● ● Envío y recepción de datos custom en tiempo real Codecs MTI (Must To Implement) – Audio: Opus, Alaw, Ulaw – Vídeo: VP8, H.264 (no decidido)
  • 4. WebRTC Media ● Establecimiento de media – – ● Ambos peers encuentran el camino más rápido para transmitir media de uno a otro ICE / STUN / TURN Seguridad – RTP audio/vídeo encriptado con DTLS-SRTP – DataChannel encriptado con DTLS (SCTP sobre DTLS sobre UDP) – Media Consent (ICE garantiza que transmitimos media al destino correcto)
  • 5. WebRTC Media ● ¿Quién debe/puede implementar todos estos requisitos? – Desktop Browsers (Chrome, Firefox, Internet Explorer, Opera...) ● ¿ Smartphone Browsers ? mmm... – – ● Apps en smartphones y tablets Servidores (Asterisk, FreeSwitch, Google Hangouts...) Interoperabilidad a nivel de media entre distintos dispositivos – NOTA: Nadie ha hablado aún de señalización
  • 6. WebRTC API ● API JavaScript para browsers – getUserMedia(): solicitar permisos de micrófono y/o webcam – RTCPeerConnection: Clase JavaScript para iniciar una sesión WebRTC con otro peer ● Envío y recepción de múltiples MediaStream de audio/vídeo ● DataChannel para envío y recepción de datos custom
  • 7. WebRTC API ● SDP Offer/Answer – API WebRTC para solicitar un SDP a nuestro browser ● – Recibimos el SDP del peer remoto ● ● Y se lo enviamos al peer remoto Y lo usamos a través del API WebRTC ¿Cómo transmitimos y recibimos el SDP? – WebSocket ● SIP over WebSocket ● XMPP/Jingle over WebSocket ● Lo-que-sea over WebSocket – HTTP AJAX (para no recargar la página) – WebRTC no impone el tipo de de señalización en red
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17. Casos de Uso WebRTC ● Póker online – ● ChatRoulette – ● ¿Sólo Web? Puesto de callcenter – ● Enseñemos nuestras partes íntimas, ¡pero sin Flash! Un nuevo “Skype” – ● Nadie “llama” a nadie ¡Plugin para Asterisk! Telefonía doméstica – mmm...
  • 18. Casos de Uso WebRTC ● Hacer feliz a tu abuela ¡¡¡ DEMO !!!
  • 20. Arquitectura RetroRTC SIP over WebSocket SIP over UDP/TCP ICE RTP PSTN
  • 22. Muchas Gracias ● A los asistentes ● A Avanzada7 por organizar el VOIP2DAY – ● (el mejor evento de VoIP de Europa) A todos los que lo hacen posible @ibc_tw @jomivi