WebRTC
1 like152 views
WebRTC provides a free and open-source framework that enables real-time communication via audio and video in web browsers and mobile apps without requiring plugins. It uses simple JavaScript APIs to capture audio and video from the user's device and stream it directly to another peer. WebRTC handles signaling, peer-to-peer connectivity, codec handling, and bandwidth management to connect users across different platforms like Chrome, Firefox, Opera, Safari, Android, and iOS. It ensures communication works even when behind NATs or firewalls using technologies like STUN, TURN, and ICE. All media is also encrypted for security by default.
WebRTC
- 1. WebRTC Allan Shih Plugin-free realtime communication
- 2. How can I make multimedia call within my apps?
- 3. Use Real Time Communication (RTC) ? • Many web services already use RTC, but need downloads, native apps or plugins. • Downloading, installing and updating plugins can be complex, error prone and annoying. • Plugins can be difficult to deploy, debug, troubleshoot, test and maintain.
- 4. WebRTC • WebRTC is a free, open project that provides browsers and mobile applications with Real-Time Communications (RTC) capabilities via simple APIs. • High quality audio and video communication • Low Cost • Plugin-free
- 5. WebRTC across platforms • Chrome • Firefox • Opera • Safari • Android • iOS 5
- 6. Demo 1. Open appr.tc in Chrome, Opera or Firefox. 2. Click the Allow button to let the app use your webcam. 3. Open the URL displayed at the bottom of the page in a new tab or, better still, on a different computer.
- 8. Three main tasks • Acquiring audio and video • Communicating audio and video • Communicating arbitrary data
- 10. The WebRTC APIs • getUserMedia(): capture audio and video. • MediaRecorder: record audio and video. • RTCPeerConnection: stream audio and video between users. • RTCDataChannel: stream data between users.
- 11. MediaStream • Represents a stream of audio and/or video • Can contain multiple 'tracks' • Obtain a MediaStream with navigator.getUserMedia()
- 12. MediaStream
- 13. simpl.info/gum
- 14. Constraints • Controls the contents of the MediaStream • Media type, resolution, frame rate
- 17. RTCPeerConnection does a lot • Signal processing • Codec handling • Peer to peer communication • Security • Bandwidth management …
- 19. simpl.info/pc
- 20. RTCDataChannel
- 21. RTCDataChannel • Enables peer-to-peer exchange of arbitrary data • Low latency • Unreliable or reliable • Secure
- 23. simpl.info/dc
- 25. Abstract Signaling • Need to exchange 'session description' objects: - What formats I support, what I want to send - Network information for peer-to-peer setup • Can use any messaging mechanism • Can use any messaging protocol
- 26. Signaling
- 27. A Call Scenario Create Offer Set Offer Send Offer Set Remote Offer Create Answer Send AnswerSet Remote Offer SDP SDP
- 29. After signaling
- 30. An ideal world
- 31. Session Traversal Utilities for NAT (STUN) • Tell me what my public IP address is • Simple server, cheap to run • Data flows peer-to-peer
- 32. STUN
- 33. Traversal Using Relays around NAT (TURN) • Provide a cloud fallback if peer-to-peer communication fails • Data is sent through server, uses server bandwidth • Ensures the call works in almost all environments
- 34. TURN
- 35. Interactive Connectivity Establishment (ICE) • WebRTC uses ICE to overcome the complexity of real-world networking • Tries to find best path to connect peers in parallel
- 37. ICE: WebRTC data pathway
- 38. Security
- 39. Security throughout WebRTC • Mandatory encryption for media and data • Secure UI, explicit opt-in • Sandboxed, no plugins • WebRTC Security Architecture
- 40. Secure pathways
- 41. Architectures
- 42. Peer to peer: one-to-one call
- 43. Mesh: small N-way call
- 44. Star: medium N-way call
- 45. Multipoint Control Unit (MCU): large N-way call
- 46. Selective Forwarding Unit (SFU): large N-way call
- 47. Topologies Full Mesh MCU SFU Client uplink Very high Low Low Client downlink Very high Low Medium Client CPU usage Very high Low Medium Server CPU usage - Very high Very Low Latency None High Low
- 48. Reference • webrtc.org • Getting Started with WebRTC • Real time communication with WebRTC • Introduction to WebRTC on Android