1. WebRTC u
PBZ video chatu
Zoran Perak @ PBZ

2. 2
Što je to WebRTC?
 Web Real-Time Communication (WebRTC) je tehnologija koja omogućuje direktnu komunikaciju
između dva internetska preglednika (peer-to-peer)
– video + zvuk
– podaci
 Media engine sa Javacript API-jem
 Standard u nastajanju
– W3C: web API
– IETF: protokoli i formati

3. Što WebRTC rješava?
 Upravljanje videom i zvukom
– "dogovor" oko korištenog standarada kodiranja s drugom stranom (SDP)
– poništavanje jeke
– automatska prilagodba kvalitete raspoloživoj brzini komunikacije
 Komunikacija s drugom stranom
– automatska uspostava veze
– korištenje "najkraćeg" puta
– zaobilaženje prepreka (STUN, TURN, ICE)
 Sigurnost (DTLS, SRTP, STCP)
3

4. Što WebRTC ne rješava?
 Signalizacija
– nije dio standarda
– razmjena inicijalnih podataka potrebnih za uspostavu veze potpuno u domeni aplikacije
– WebRTC proizvodi sve potrebne podatke – aplikacija ih razmjeni sa drugom stranom
4

5. Javascript API
Funkcionalnosti:
 Pristup lokalnom mikrofonu i kameri
 Komunikacija video i zvuka
 Komunikacija podataka
5

6. Javascript API
Objekti:
 MediaStream (getUserMedia)
– pristup kameri, mikrofonu i ekranu
 RTCPeerConnection
– kodiranje/dekodiranje videa/zvuka
– komunikacija s drugom stranom preko raznih mrežnih topologija
– dodavanje audio i video streamova
 RTCDataChannel
– razmjena proizvoljnih podataka sa drugom stranom (P2P)
6

7. MediaStream
 Predstavlja video i audio stream
 Može sadržavati više kanala
 Dobiva se Javascript pozivom navigator.getUserMedia()
7

8. MediaStream
8

9. RTCPeerConnection
 Kodiranje/dekodiranje videa i zvuka
 Uspostavlja i održava stabilnu vezu sa drugom stranom (RTCPeerConnection objektom u drugom
pregledniku)
 Prilagođavanje raspoloživoj brzini veze
 Sigurnost
 Inicijalno je potrebno odraditi signalizaciju (aplikacija):
– razmjena SDP paketa (offer – answer)
– razmjena ICE kandidata
9

10. RTCPeerConnection
10

11. RTCDataChannel
 Isti API kao WebSockects
 Vrlo mala latencija
 Pouzdana ili nepouzdana komunikacija (UDP/TCP)
 Sigurnost
11

12. Arhitektura
12

13. Aplikacija
13

14. Pronalaženje puta...
14

15. Sigurnost
 DTLS (Datagram Transport Layer Security)
 SRTP (Secure Real-time Transport Protocol)
15

16. Desktop:

 SDK
Android:

 SDK
iOS:
 SDK
Podrška
16

17. 17
Video chat @

18. PBZ
 Implementacija video chata unutar internet bankarstva
 Korištenje postojećeg CCC rješenja (vanjski dobavljač)
– chat i video chat su samo dodatni kanal za komunikaciju
– poslovni procesi i infrastruktura se ne mijenjaju
 Problem P2P komunikacije zbog sigurnosti
– nije moguća direktna veza između klijenta i agenta u CCC-u
– korištenje TURN servera
18

19. PBZ
19

20. PBZ
20

21. PBZ
21

22.  http://www.webrtc.org
 http://www.html5rocks.com/en/tutorials/webrtc/basics/
 http://simpl.info/
 https://apprtc.appspot.com/
 http://simplewebrtc.com/
 https://webrtchacks.com/
22