WebRTC (概要から中の仕組みまで)

Transcript

1. WebRTC High Performance Browser Networking ྠಡձ @yosuke_furukawa

2. WebRTC Web Real-Time Communication

3. None

4. ฉ͍ͨ΄͏͕͍͍΍ͭ

5. Web x Realtimeͷྺ࢙ 2005೥: Ajax ੜ஀ 2006೥: Comet͕Ajaxͱͱ΋ʹݟ௚͞ΕΔ 2006೥: ServerSentEvents

   ఏҊ։࢝ 2011೥: WebSocket͕ग़ͯ͘Δ 2012೥: WebRTC *(new!!)

6. WebRTCͱ͸? WebRTC͸ϒϥ΢β্Ͱ ϦΞϧλΠϜίϛϡχέʔγϣϯʢRTCʣ ΛՄೳʹ͢Δ΢ΣϒͷͨΊͷϑϨʔϜϫʔΫ ! ΢ΣϒͰͷߴ඼࣭ͳίϛϡχέʔγϣϯͷͨΊ Ի੠ʗϏσΦνϟοτΞϓϦέʔγϣϯ Ͱར༻͞ΕΔωοτϫʔΫɾԻ੠ɾө૾ίϯϙʔωϯτͳͲͷجຊ తͳߏ੒ཁૉؚ͕·ΕΔ 


   (ࢀߟจݙ: WebRTCͱ͔ษڧձ ͋ΜͲ͏΍͢͠)

7. WebRTC͕ఏڙ͢ΔAPI - MediaStream : Ի੠΍ಈըͷετϦʔϜऔಘ - RTCPeerConnection: Ի੠΍ಈըͷ௨৴ - DataChannel:

   ೚ҙͷΞϓϦέʔγϣϯσʔλͷ௨ ৴

8. WebRTC͕ఏڙ͢ΔAPI - MediaStream : Ի੠΍ಈըͷετϦʔϜऔಘ - RTCPeerConnection: Ի੠΍ಈըͷ௨৴ - DataChannel:

   ೚ҙͷΞϓϦέʔγϣϯσʔλͷ௨ ৴

9. MediaStream

10. MediaStreamΛࢧ͑Δٕज़ - Ի੠ɾಈըॲཧΤϯδϯ - getUserMedia API

11. Ի੠ɾಈըॲཧΤϯδϯ

12. Ի੠ɾಈըॲཧΤϯδϯ Ի੠ɾಈըॲཧΤϯδϯ͸͜ͷຊͰ͸ઐ໳ൣғ֎ɻ Ի੠ɾಈըॲཧΛ࣮ݱ͢Δʹ͸ɺίʔσοΫɺΤίʔ আڈɺϊΠζϦμΫγϣϯɺը૾ิਖ਼ͱ͍ͬͨॲཧ Λϒϥ΢β͕ػೳͱͯ࣋ͭ͠ඞཁ͕͋Δɻ

13. Ի੠ɾಈըॲཧΤϯδϯ

14. Ի੠ɾಈըॲཧΤϯδϯ ͜Ε͚ͩͷػೳΛ
    ༻ҙ͢Δඞཁ͕͋Δɻ

15. getUserMedia

16. getUserMedia Ի੠ಈըΛStreamͱͯ͠ड͚औΔJavaScriptͷAPIɻ͜ΕΛ MediaStreamͱݺͿɻ ͜ΕΛvideoλάʹ౉ͤ͹ࣗ෼ͷಈը࠶ੜɻ ͜ΕΛRTCPeerConnectionʹ౉ͤ͹WebRTCͷετϦʔϜΛ ૹΔ͜ͱ͕Մೳɻ

17. getUserMedia <video autoplay></video> <script> navigator.getUserMedia = ( navigator.getUserMedia || navigator.webkitGetUserMedia

    || navigator.mozGetUserMedia || navigator.msGetUserMedia); var constraints = { audio: true, video: true } navigator.getUserMedia(constraints, gotStream, logError); function gotStream(stream) { var video = document.querySelector('video'); video.src = window.URL.createObjectURL(stream); video.play(); } function logError(error) { console.log(error); } </script>

18. DEMO

19. MediaStreamͷ·ͱΊ -Ի੠ɾಈըॲཧΤϯδϯ͕ϒϥ΢βʹଘࡏ͍ͯ͠ ΔɺΤίʔɺϊΠζॲཧ΍ಈըίʔσοΫͱ͍ͬͨ ϝσΟΞͷॲཧ͸ϒϥ΢βͰ࣮ݱ͞ΕΔ(ศར)ɻ -औಘ͢Δʹ͸getUserMediaΛ࢖͏

20. WebRTC͕ఏڙ͢ΔAPI - MediaStream : Ի੠΍ಈըͷετϦʔϜऔಘ - RTCPeerConnection: Ի੠΍ಈըͷ௨৴ - DataChannel:

    ೚ҙͷΞϓϦέʔγϣϯσʔλͷ௨ ৴

21. RTCPeerConnection

22. RTCPeerConnectionͱ͸ P2P઀ଓΛཱ֬ͤ͞ΔͨΊͷॲཧͱͦΕΛҡ࣋͠ଓ ͚ΔͨΊͷॲཧΛఏڙ͢Δػೳɻ

23. RTCPeerConnectionͱ͸ P2P઀ଓΛཱ֬ͤ͞ΔͨΊͷॲཧͱͦΕΛҡ࣋͠ଓ ͚ΔͨΊͷॲཧΛఏڙ͢Δػೳɻ

24. RTCPeerConnectionͱ͸ P2P઀ଓΛཱ֬ͤ͞ΔͨΊͷॲཧͱͦΕΛҡ࣋͠ଓ ͚ΔͨΊͷॲཧΛఏڙ͢Δػೳɻ 35$Λߦ͏ͨΊɺ6%1૚Ͱ
    ߦΘΕΔɻ 8FCʹ6%1͕ʂ

25. RTCPeerConnectionͱ͸ P2P઀ଓΛཱ֬ͤ͞ΔͨΊͷॲཧͱͦΕΛҡ࣋͠ଓ ͚ΔͨΊͷॲཧΛఏڙ͢Δػೳɻ 35$1FFS$POOFDUJPO͸͜͜ͷ࿩

26. RTCPeerConnection API 1. SDP (P2PωΰγΤʔτ࣌ͷσʔλϑΥʔϚοτ) 2. ICE protocol (NATΛ௒͑ͯP2P઀ଓཱ֬ҡ࣋͢ΔͨΊ) -

    STUN - TURN 3. DTLS (௨৴҉߸Խ) 4. SRTP, SCTP (ετϦʔϜଟॏԽɺ᫔᫓੍ޚɺϑϩʔ੍ޚ)

27. RTCPeerConnection API - RTCPeerConnectionͷͨΊͷAPIࣗମ͸γϯϓϧɹ

28. RTCPeerConnection API - RTCPeerConnectionͷͨΊͷAPIࣗମ͸γϯϓϧɹ ΠϯλϑΣʔε͸ 35$1FFS$POOFDUJPO
    ɹΛ௨ͯ͠-PDBM3FNPUF
    TUSFBNTʹ઀ଓ͢Δ͚ͩ

29. RTCPeerConnection API - RTCPeerConnectionͷͨΊͷAPIࣗମ͸γϯϓϧɹ ͨͩதͰ΍ͬͯΔ͜ͱ͸
    ෳࡶ  /"5τϥόʔαϧΛߦ͏*$&ϫʔ Ϋϑϩʔ؅ཧ
    

    ϐΞؒͷࣗಈΩʔϓΞϥΠϒ
     ϩʔΧϧετϦʔϜͷมԽه࿥
     ϦϞʔτετϦʔϜͷมԽه࿥
     ετϦʔϜ࠶ωΰγΤʔγϣϯ
     ΦϑΝʔੜ੒ɺΞϯαʔडྖ"1*
     ݱࡏͷঢ়ଶϦΫΤετ"1*

30. P2P઀ଓΛཱ֬ ͦ΋ͦ΋઀ଓཱ֬ͱ͸?

31. P2P઀ଓΛཱ֬ ͦ΋ͦ΋઀ଓཱ֬ͱ͸? (HTTPͷ৔߹) MJTUFO QVCMJD
    *1
    1035
     1VCMJD
    *11035ΛΫϥΠΞϯτ͕஌͍ͬͯͯ
     αʔόʔ͕઀ଓΛ଴͍ͬͯͯ
    

     ͦ͜ʹ઀ଓΛཁٻ͠ʹߦ͘

32. P2P઀ଓΛཱ֬ ͦ΋ͦ΋઀ଓཱ֬ͱ͸? (WebRTCͷ৔߹) *1 1035
     8FC35$ͷ৔߹͸*1΋1035΋෼͔Βͳ͍
     ΋͠΋෼͔ͬͨͱͯ͠΋૬ख͕઀ଓΛཁٻͯ͠Δͱ͸ݶΒͳ͍
    

     /"5ʹΑͬͯ஄͔ΕΔՄೳੑ΋͋Δ ଴ػ /"5 /"5

33. P2P઀ଓΛཱ֬ ઀ଓཱ֬͢ΔͨΊʹ΍Δ͜ͱɻ *1 1035
     8FC35$ͷ৔߹͸*1΋1035΋෼͔Βͳ͍
     ΋͠΋෼͔ͬͨͱͯ͠΋૬ख͕઀ଓΛཁٻͯ͠Δͱ͸ݶΒͳ͍
    

    /"5ʹΑͬͯ஄͔ΕΔՄೳੑ΋͋Δ ଴ػ /"5 /"5

34. P2P઀ଓΛཱ֬ P2P઀ଓͷ։࢝ҙਤΛ૬खʹ఻͑ͯɺ౸ணύ έοτΛ଴ػ͢Δ

35. P2P઀ଓΛཱ֬ P2P઀ଓͷ։࢝ҙਤΛ૬खʹ఻͑ͯɺ౸ணύ έοτΛ଴ػ͢Δ ͜ΕΛγάφϦϯάͱ͍͏

36. P2P઀ଓΛཱ֬ WebRTC͸γάφϦϯάࣗ਎͸ΞϓϦέʔ γϣϯʹґଘ͢ΔɻͳͷͰγάφϦϯάͷτ ϥϯεϙʔτͱϓϩτίϧͷબ୒͸ࣗ༝

37. RTCPeerConnection API 1. SDP (P2PωΰγΤʔτ࣌ͷσʔλϑΥʔϚοτ) 2. ICE protocol (NATΛ௒͑ͯP2P઀ଓཱ֬ҡ࣋͢ΔͨΊ) -

    STUN - TURN 3. DTLS (௨৴҉߸Խ) 4. SRTP, SCTP (ετϦʔϜଟॏԽɺ᫔᫓੍ޚɺϑϩʔ੍ޚ)

38. SDP

39. Session Description Protocol

40. ͭ·Γ͸ηογϣϯهड़༻ϓ ϩτίϧ

41. Sesssion Description Protocol (SDP) WebRTC༻ͷηογϣϯهड़༻ϓϩτίϧ

42. Sesssion Description Protocol (SDP) ͋·Γҙࣝ͢Δ͜ͱແ͍͕ɺύέοτΩϟϓ νϟϨϕϧͰ͸ૹ৴͞Ε͍ͯΔ಺༰͕෼͔Δɻ

43. Sesssion Description Protocol (SDP) ηογϣϯهड़͕ަ׵͞ΕΔͱϝοηʔδͷަ׵͕ՄೳʹͳΔ SDPͰऔಘ͢Δ΋ͷ: ετϦʔϜͷλΠϓ(Ի੠ɺಈը) ίʔσοΫͳͲͷઃఆ ૬खͷIPͱPORT !

44. RTCPeerConnection API 1. SDP (P2PωΰγΤʔτ࣌ͷσʔλϑΥʔϚοτ) 2. ICE protocol (NATΛ௒͑ͯP2P઀ଓཱ֬ҡ࣋͢ΔͨΊ) -

    STUN - TURN 3. DTLS (௨৴҉߸Խ) 4. SRTP, SCTP (ετϦʔϜଟॏԽɺ᫔᫓੍ޚɺϑϩʔ੍ޚ)

45. ICE

46. Interactive Connection Establishment

47. ICE P2P௨৴ͷͨΊʹ௒͑ͳ͍ͱ͍͚ͳ͍น (NAT௒͑) ICE͕ఏڙͯ͘͠ΕΔ΋ͷ͸௨৴ܦ࿏ͷཱ֬ *1 1035
     8FC35$ͷ৔߹͸૬खͷ*1΋1035΋෼͔Βͳ͍
    

    ΋͠΋෼͔ͬͨͱͯ͠΋/"5ʹΑͬͯ஄͔ΕΔՄೳੑ΋͋Δ ଴ػ /"5 /"5

48. ICE P2P௨৴ͷͨΊʹ௒͑ͳ͍ͱ͍͚ͳ͍น (NAT௒͑) ICE͕ఏڙͯ͘͠ΕΔ΋ͷ͸௨৴ܦ࿏ͷཱ֬ *1 1035
     8FC35$ͷ৔߹͸૬खͷ*1΋1035΋෼͔Βͳ͍
    

    ΋͠΋෼͔ͬͨͱͯ͠΋/"5ʹΑͬͯ஄͔ΕΔՄೳੑ΋͋Δ ଴ػ /"5 /"5 ͜ΕΛղܾ͢Δखஈ

49. ICEͷલʹNATτϥόʔαϧʹ ͍͓ͭͯ͞Β͍͓ͯ͘͠ɻ

50. NATτϥόʔαϧ NATʹ͸private IP/PORTͱpublic IP/PORTͷ૊Έ߹ Θ͕ͤॻ͔Ε͍ͯΔΤϯτϦ͕͋Δɻ

51. NATτϥόʔαϧ NATʹ͸private IP/PORTͱpublic IP/PORTͷ૊Έ߹ Θ͕ͤॻ͔Ε͍ͯΔΤϯτϦ͕͋Δɻ ͜ͷΤϯτϦʹॻ͔Ε͍ͯͳ͍*1 1035ͷ૊Έ߹Θͤͩͱ/"5֎͔Β ΞΫηεͯ͠΋/"5಺ʹಧ͔ͳ͍

52. NATτϥόʔαϧ NATʹ͸private IP/PORTͱpublic IP/PORTͷ૊Έ߹ Θ͕ͤॻ͔Ε͍ͯΔΤϯτϦ͕͋Δɻ ͪͳΈʹ͜ͷΤϯτϦͷू߹Λ
    USBOTMBUJPO
    UBCMF ຋༁ςʔϒϧ ͱ ݺͿ

53. NATτϥόʔαϧ NATʹ͸private IP/PORTͱpublic IP/PORTͷ૊Έ߹ Θ͕ͤॻ͔Ε͍ͯΔΤϯτϦ͕͋Δɻ ٯʹݴ͑͹͜͜ʹॻ͔Ε͍ͯΔ૊ Έ߹Θ͕ͤ෼͔Ε͹/"5಺ͷϐΞ ʹΞΫηεՄೳ

54. NATτϥόʔαϧ NATʹ͸private IP/PORTͱpublic IP/PORTͷ૊Έ߹ Θ͕ͤॻ͔Ε͍ͯΔΤϯτϦ͕͋Δɻ ͨͩ͠ɺ/"5͸಺෦ͷ*11035Λ શͯอ͍࣋ͯ͠ΔΘ͚Ͱ͸ͳ͍ɻ
    ΞΫηε͕༗Δ౓ʹ຋༁ςʔϒϧʹ ௥Ճ͍ͯ͠Δɻ

55. NATτϥόʔαϧ NATʹ͸private IP/PORTͱpublic IP/PORTͷ૊Έ߹ Θ͕ͤॻ͔Ε͍ͯΔΤϯτϦ͕͋Δɻ ͭ·Γɺ/"5ͷ຋༁ςʔϒϧʹ*1 1035ͷ૊ΛࡌͤΔʹ͸Ұ୴/"5͔ Β֎ʹϦΫΤετΛ͓͘Δඞཁ͕ ͋Δɻ

56. STUN ࣗ෼ͷIPͱPORT͕֎͔ΒݟΔͱͳΜͳͷ͔໰͍߹Θ ͤΔɻ

57. STUN ࣗ෼ͷIPͱPORT͕֎͔ΒݟΔͱͳΜͳͷ͔໰͍߹Θ ͤΔɻ ͜͏͢Δ͜ͱͰ/"5ͷ຋༁ςʔϒϧʹࣗ෼ͷ*1 1035ΛࡌͤΔࣄ͕Ͱ͖Δɻ ·ͨ456/͔Βड͚ͨࣗ෼ͷ1VCMJD
    *1ͱ1035Λ
 ଞͷϐΞʹ౉ͤ͹௚઀௨৴͢Δ͜ͱ͕Ͱ͖Δɻ

58. TURN STUNΛ࢖ͬͯ΋઀ଓͰ͖Δͱ͸ݶΒͳ͍ɺͦ΋ͦ΋ UDPΛϒϩοΫ͢ΔϑΝΠΞ΢Υʔϧ͕͋ͬͨΒ݁ ہ઀ଓͰ͖ͳ͍ɻͦ͏͍͏࣌ʹ࢖͏ͷ͕TURN

59. TURN STUNΛ࢖ͬͯ΋઀ଓͰ͖Δͱ͸ݶΒͳ͍ɺͦ΋ͦ΋ UDPΛϒϩοΫ͢ΔϑΝΠΞ΢Υʔϧ͕͋ͬͨΒ݁ ہ઀ଓͰ͖ͳ͍ɻͦ͏͍͏࣌ʹ࢖͏ͷ͕TURN தؒͷ563/αʔόʔ͕σʔλΛ5$16%1 ͰϦϨʔͤ͞Δɻ΋͸΍11Ͱ͸ͳ͍͕ɺ
 ࣮֬ʹͭͳ͕Δɻ

60. ICE ICE͸STUN/TURNͱ͍ͬͨܦ࿏બ୒Λ࣮ࢪ͢Δ 
    ·ͣࣗ෼ͷϩʔΧϧ*1Λ 04ʹ໰͍߹ΘͤΔ

61. ICE 456/αʔόʹࣗ෼ͷ*1 1035Λ໰͍߹ΘͤΔɻ 456/

62. ICE 456/ʹܨ͕Βͳ͔ͬͨΒ 563/Λ࢖ͬͯϦϨʔͤ͞Δ 456/ ✗ 563/

63. ICE P2P௨৴ͷͨΊʹ௒͑ͳ͍ͱ͍͚ͳ͍น (NAT௒͑) 456/ʹܨ͕Βͳ͔ͬͨΒ 563/Λ࢖ͬͯϦϨʔͤ͞Δ 456/ ✗ 563/ ࣗಈͰ456/ɺ563/ͷ੾Γ ෼͚Λͯ͘͠ΕΔɻศརɻ

64. ICE ICEʹ΋໰୊͕͋Δɻॳظ઀ଓʹ͕͔͔࣌ؒΔɻ ઀ଓܦ࿏͕ܾ·Δ·Ͱ࣌ؒ ͔͔Γա͗Δɻ 456/ ✗ 563/

65. ͦ͜Ͱ Trickle ICE

66. Trickle ICE STUN, TURNͷީิݕࡧͱಉ࣌ʹγάφϦϯάνϟω ϧΛ࢖ͬͯࣗ෼ͷ௨৴ܦ࿏Λૹ৴͠ɺݟ͔ͭͬͨஈ֊ ͰͦΕΛ࢖͏ɻSTUN/TURNͷશܦ࿏͕ܾ·ΔͷΛ଴ ͭඞཁ͕ͳ͍ɻ

67. Trickle ICE STUN, TURNͷީิݕࡧͱಉ࣌ʹγάφϦϯάνϟω ϧΛ࢖ͬͯࣗ෼ͷ௨৴ܦ࿏Λૹ৴͠ɺݟ͔ͭͬͨஈ֊ ͰͦΕΛ࢖͏ɻSTUN/TURNͷશܦ࿏͕ܾ·ΔͷΛ଴ ͭඞཁ͕ͳ͍ɻ ީิΛݟ͚ͭͳ͕Βಉ࣌ʹγάφϦϯάνϟ ωϧͰܦ࿏ΛૹΓɺީิ͕ݟ͔ͭͬͨ୺͔Β ઀ଓΛࢼΈΔͷͰॳظ઀ଓ͕ૣ͘ͳΔɻ

68. ࣮ࡍʹಈ͔ͦ͏ DEMO http://simplewebrtc.com/demo.html

69. ͪͳΈʹ

70. chromeͩͱWebRTCͷ௨৴ঢ়گ͸ҎԼͷ ίϚϯυΛurlϑΥʔϜʹଧͭͱݟΕΔɻ chrome://webrtc-internals

71. RTCPeerConnection API 1. SDP (P2PωΰγΤʔτ࣌ͷσʔλϑΥʔϚοτ) 2. ICE protocol (NATΛ௒͑ͯP2P઀ଓཱ֬ҡ࣋͢ΔͨΊ) -

    STUN - TURN 3. DTLS (௨৴҉߸Խ) 4. SRTP, SCTP (ετϦʔϜଟॏԽɺ᫔᫓੍ޚɺϑϩʔ੍ޚ)

72. DTLS

73. D (Datagram) + TLS

74. WebRTCͰ͸ɺUDPͷ௨৴Λ҉ ߸Խ͢ΔͷʹDTLSΛ࢖͍ͬͯΔ

75. DTLS UDP͸ॱෆಉͰύέϩεΛڐ༰͢Δ͕ɺTLS͸ڐ༰͠ ͳ͍ɻ DTLS͸಺෦Ͱ͜ΕΛ๷͙ͨΊʹ಺෦ʹγʔέϯε൪ ߸ͱϑϥάϝϯτΦϑηοτɺͦͯ͠λΠϜΞ΢τ ࣍ͷ࠶ૹͷ࢓૊ΈΛఏڙ͍ͯ͠Δɻ

76. DTLS γʔέϯε൪߸ ϑϥάϝϯτΦϑηοτ

77. DTLS ύέοτ ࣌ؒ಺ʹฦ৴͕ͳ͔ͬͨΒ࠶ૹ

78. DTLS ύέοτ ࣌ؒ಺ʹฦ৴͕ͳ͔ͬͨΒ࠶ૹ 6%1্Ͱ΋ಈ͘%5-4͕ͩɺ
 جຊ͸5$1Ͱ΍ͬͯΔ͜ͱʹ͍ۙ

79. RTCPeerConnection API 1. SDP (P2PωΰγΤʔτ࣌ͷσʔλϑΥʔϚοτ) 2. ICE protocol (NATΛ௒͑ͯP2P઀ଓཱ֬ҡ࣋͢ΔͨΊ) -

    STUN - TURN 3. DTLS (௨৴҉߸Խ) 4. SRTP, SCTP (ετϦʔϜଟॏԽɺ᫔᫓੍ޚɺϑϩʔ੍ޚ)

80. SRTP

81. Secure Realtime Transport Protocol

82. SRTP IUUQXXXTMJEFTIBSFOFUJXBTIJXFC SUDNFFUVQS

83. SRTP

84. SRTP UJNFTUBNQ TFRVFODF
    OVNCFS
    ແࢹʂʂ

85. SRTP

86. SRTP

87. SRTP 4FRVFODF
    /VNCFSͱ 5JNFTUBNQΛ࣋ͭ

88. SCTP

89. Stream Control Transmission Protocol

90. SCTP

91. SCTP ͭͷΤϯυϙΠϯτؒͰҰͭͷ઀ଓͷ্Ͱ ಠཱͨ͠ෳ਺ͷσʔλΛૹΔ͜ͱ͕Ͱ͖Δ

92. ͋Ε͜ΕͲ͔ͬͰฉ͍ͨ͜ͱ ແ͍???

93. http2

94. http2ͱSCTPɺϨΠϠʔ͸ҧ ͏͚ͲࢼΈ͸ࣅ͍ͯΔɻ

95. SCTP͸TCP/UDPͱಉ͡ϨΠϠʔ (τϥϯεϙʔτ૚)ͷϓϩτίϧ

96. ίϥϜɿૉͷSCTPͷ࿩ ࣮ࡍࠓͷTCP/UDPΛશͯSCTPʹͨ͠ΒͲ͏͔ɺͱ͍͏આ΋͋Δɻ HTTP2.0͕࣮ݱ͠Α͏ͱ͍ͯ͠Δͷ͸SCTPΛhttpͷϨΠϠͰ࣮ݱ͠Α͏ͱ͍ͯ͠ΔͷͰɺ SCTP͕࠾༻Ͱ͖ͨΒhttp2ͷ໰୊ͷ΄ͱΜͲ͕ࣗಈతʹղܾ͞ΕΔɻ
 (ͳ͓ɺGoogle͸ͦΕͰ͸ෆຬͳͨΊɺQUICΛ࡞ͬͨ໛༷ɻ) 
 ͔͠͠ɺطଘͷϧʔλ΍NATσόΠε͸SCTPΛϕʔεʹ͍ͯ͠ͳ͍ɻ͔ͩΒΠϯλʔωοτ্ ͰSCTPΛجຊʹ͢Δ͜ͱ͸ࠓͷͱ͜Ζເ෺ޠɻ ͨͩ͠ɺ಺෦ωοτϫʔΫͳΒ࢖͑Δɻ࣮ࡍʹSCTP͸๻Β΋࢖͍ͬͯͯɺLTEΛѻ͍ͬͯΔ ΩϟϦΞ͸಺෦ͷσʔλ௨৴͸SCTPͰ͋ΓɺΠϯλʔωοτΛྲྀ࣌͢ʹTCP/UDPʹม׵ͯ͠

    ͍Δɻ 
 (ͱɺॻ͔Εͯ͸͍Δ΋ͷͷ࣮ࡍʹ͸ೝূαʔόͷҰ෦Ͱ࢖͏ఔ౓Ͱجຊ͸TCPͷ༷ࢠ)

97. WebRTC͕ఏڙ͢ΔAPI - MediaStream : Ի੠΍ಈըͷετϦʔϜऔಘ - RTCPeerConnection: Ի੠΍ಈըͷ௨৴ - DataChannel:

    ೚ҙͷΞϓϦέʔγϣϯσʔλͷ௨ ৴

98. DataChannel

99. DataChannel ϐΞؒͷΞϓϦέʔγϣϯσʔλΛ΍ΓͱΓ ͢Δ΍ʔͭɻ ૒ํ޲ੑΛ࣋ͭɻ΍ͬͱ͜͜·Ͱདྷͨײ͋Δɻ

100. Μ?

101. DataChannel ϐΞؒͷΞϓϦέʔγϣϯσʔλΛ΍ΓͱΓ ͢Δ΍ʔͭɻ ૒ํ޲ੑΛ࣋ͭɻ΍ͬͱ͜͜·Ͱདྷͨײ͋ Δɻ

102. ૒ํ޲ੑ?

103. WebSocket

104. DataChannel ࣮͸DataChannel API͸WebSocket APIͱ ͦͬ͘Γɺͦͯ͠ҙਤతʹࣅͤͯΔɻ

105. DataChannel var peerConnection = new RTCPeerConnection(); ! var dataChannel =

     peerConnection.createDataChannel("myLabel", dataChannelOptions); ! dataChannel.onopen = function () { dataChannel.send("Hello World!"); }; ! dataChannel.onclose = function () { console.log("The Data Channel is Closed"); }; ! dataChannel.onerror = function (error) { console.log("Data Channel Error:", error); }; ! dataChannel.onmessage = function (event) { console.log("Got Data Channel Message:", event.data); }; !

106. WebSocket var webSocket = new WebSocket(‘ws://echo.websocket.org/'); ! ! webSocket.onopen =

     function(){ console.log("Connection Opened"); } webSocket.onclose = function(){ console.log("Connection Closed"); } webSocket.onerror = function(evt){ console.log("The following error occurred: " + evt.data); } webSocket.onmessage = function(evt){ console.log("The following data was received:" + evt.data); }

107. WebSocket var webSocket = new WebSocket(‘ws://echo.websocket.org/'); ! ! webSocket.onopen =

     function(){ console.log("Connection Opened"); } webSocket.onclose = function(){ console.log("Connection Closed"); } webSocket.onerror = function(evt){ console.log("The following error occurred: " + evt.data); } webSocket.onmessage = function(evt){ console.log("The following data was received:" + evt.data); } ΫϦιπ

108. DataChannelͱWebSocket ͷҧ͍ - WebSocket͸TCPɺDataChannel͸UDP, DTLS, SCTPͷ3ͭͷϓϩτίϧͷ্Ͱಈ࡞͢ Δɻ

109. DataChannelͱWebSocket ͷҧ͍ - ͭ·ΓDataChannel͸৴པੑɺॱংอূΛ ୲อ͢Δ͜ͱ΋୲อ͠ͳ͍͜ͱ΋Ͱ͖Δɺઃ ఆՄೳɻ

110. DataChannel ଞͷݴ༿Ͱݴ͏ͱDataChannelͷಛ௃͸ 1. ෦෼త৴པੑΛఏڙͰ͖Δɻ - ࠶ૹճ਺੍ݶΛઃ͚ͯͦΕҎ্ϛεͬͨΒఘΊΔ - λΠϜΞ΢τظؒΛઃ͚ͯͦΕҎ্ϛεͬͨΒఘΊΔ 2. ॱෆಉʹσʔλΛड͚౉͢͜ͱ΋Ͱ͖Δɻ

111. DataChannel ଞͷݴ༿Ͱݴ͏ͱDataChannelͷಛ௃͸ 1. ෦෼త৴པੑΛఏڙͰ͖Δɻ - ࠶ૹճ਺੍ݶΛઃ͚ͯͦΕҎ্ϛεͬͨΒఘΊΔ - λΠϜΞ΢τظؒΛઃ͚ͯͦΕҎ্ϛεͬͨΒఘΊΔ 2. ॱෆಉʹσʔλΛड͚౉͢͜ͱ΋Ͱ͖Δɻ

     5$1͔Β6%1·Ͱͷ৴པੑͱޮ཰ ͷτϨʔυΦϑΛબ୒Ͱ͖Δ

112. ٯʹݴ͑͹

113. ઃఆΊΜͲ͍ ƅ㱼ƅ)

114. DataChannel ύέοτϩεͷཱ֬ͱϐΞؒͷϨΠςϯγ͸༧ଌͰ ͖ͳ͍ɻͦͷͨΊɺ࠶ૹΧ΢ϯλ΍λΠϜΞ΢τͷ ઃఆ஋ʹ͸࠷దղ͸ଘࡏ͠ͳ͍ɻ ! ΋͠΋৴པੑͷ௿͍νϟωϧͰ࠷ྑͷ݁ՌΛಘ͚ͨ Ε͹ɺϝοηʔδΛখ͘͢͞Δ͜ͱͩɻ

115. DataChannel ύέοτϩεͷཱ֬ͱϐΞؒͷϨΠςϯγ͸༧ଌͰ ͖ͳ͍ɻͦͷͨΊɺ࠶ૹΧ΢ϯλ΍λΠϜΞ΢τͷ ઃఆ஋ʹ͸࠷దղ͸ଘࡏ͠ͳ͍ɻ ! ΋͠΋৴པੑͷ௿͍νϟωϧͰ࠷ྑͷ݁ՌΛಘ͚ͨ Ε͹ɺϝοηʔδΛখ͘͢͞Δ͜ͱͩɻ ઃఆ͸ঢ়گʹԠͯ͡ରԠ͠ͳͯ͘ ͸ͳΒͳ͍ɺಛʹ࠷దղ͸ͳ͍ɻ

116. WebRTCͷϢʔεέʔεͱ ύϑΥʔϚϯε

117. WebRTCͰέΞ͢Δ͜ͱ - ͱΓ͋͑ͣҰ൪͸ଳҬ෯ ͍͘Βѹॖ͍ͯ͠Δͱݴͬͯ΋ଳҬ͸৯͏ɻ ! HDΫΦϦςΟͩͱ1.2MbpsͷଳҬ͕ඞཁ શੈքతʹ͸ฏۉଳҬ෯͸3.1Mbps͔͠ͳ͍ HDετϦʔϜΛૹΔͳΒ࠷௿Ͱ΋3.5G+ ͷ઀ଓ͕ඞཁ

118. WebRTCͰέΞ͢Δ͜ͱ ࣍ʹγάφϦϯάαʔόʔ͕ඞཁ γάφϦϯάʹ͸ϨΠςϯγΛ୹͘͢Δ͜ͱ͕ෆՄܽɻ ͦͷͨΊWebSocket΍XHRɺSSEͱ͍ͬͨ઀ଓΛҡ࣋͢Δαʔό͕ඞ ཁʹͳΔɻ Φϓγϣϯͱͯ͠DataChannelΛ࢖͏͜ͱͰϐΞؒͷ઀ଓཱ֬ޙ͸WS ͷ୅ΘΓʹDataChannelͰݞ୅ΘΓͰ͖Δɻ ͜͏͢ΔͱγάφϦϯάαʔόʔͷෛՙ͕ݮΔɻ

119. WebRTCͰέΞ͢Δ͜ͱ ࠷ޙʹSTUNͱTURNͷαʔό͕ඞཁ NAT͸ϓϥΠϕʔτωοτϫʔΫ্ʹ͸΄΅࣮֬ʹଘࡏ͢Δɻ STUNαʔό͸stundͱ͍͏ਓؾͷOpenSourceαʔό͕͋ΔͷͰݕ౼͢Δ ͜ͱɻ UDPΛϒϩοΫ͍ͯ͠Δ؀ڥ͕͋Δ͜ͱ΋ߟ͑ΔͱTURNͷಋೖ΋ඞཁʹ ͳΔɻTURNʹܨ͕ΔͱTCPͱಉ༷ͷ઀ଓํࣜʹͳΔͨΊɺ΄ͱΜͲUDP ͷྑ͞͸ಘΒΕͳ͍ɻ࠷ऴखஈͱͯ͠ݕ౼͢Δ͜ͱɻ

120. ͱ͍͏Θ͚Ͱߟ͑ͳ͖Ό͍͚ͳ ͍͜ͱ͸ଟ͍ɻ

121. ͬ͟ͱ্͛Δͱ

122. 456/ /"5 /"5 563/ 4JHOBMJOH
     4FSWFS /"5Λ௒͑ΔͨΊͷ456/ 563/ɻ *$&
     "HFOUͰ੾Γ෼͚ΔɺՄೳͩͬ ͨΒΛ5SJDLMF
     *$&Λ࢖͏ɻ 84

     
     44&౳ͷ௿ϨΠςϯγͷαʔόʔΛ ࡞Δɻ઀ଓཱ֬ޙ͸%BUB$IBOOFM্Ͱͷ γάφϦϯάΛߦ͏ࣄΛߟྀ͢Δɻ ͪΌΜͱଳҬ෯ʹ஫ҙ͢Δɻ
     σʔλ͸ͳΔ΂͘খ͘͢͞Δɻ
     ద੾ͳϝσΟΞ੍ݶΛઃ͚Δɻ
     %BUB$IBOOFMͷόοϑΝσʔλ͸؂ࢹ͓͖ͯ͠ɺωοτϫʔΫϦϯΫͷঢ়گ ʹదԠͤ͞Δɻ
     ෦෼త৴པੑͷ͋Δ഑৴ͳΒ࠶ૹΧ΢ϯτͱλΠϜΞ΢τΛద੾ʹઃఆ͢Δɻ

123. 456/ /"5 /"5 563/ 4JHOBMJOH
     4FSWFS /"5Λ௒͑ΔͨΊͷ456/ 563/ɻ *$&
     "HFOUͰ੾Γ෼͚ΔɺՄೳͩͬ ͨΒΛ5SJDLMF
     *$&Λ࢖͏ɻ 84

     
     44&౳ͷ௿ϨΠςϯγͷαʔόʔΛ ࡞Δɻ઀ଓཱ֬ޙ͸%BUB$IBOOFM্Ͱͷ γάφϦϯάΛߦ͏ࣄΛߟྀ͢Δɻ ͪΌΜͱଳҬ෯ʹ஫ҙ͢Δɻ
     σʔλ͸ͳΔ΂͘খ͘͢͞Δɻ
     ద੾ͳϝσΟΞ੍ݶΛઃ͚Δɻ
     %BUB$IBOOFMͷόοϑΝσʔλ͸؂ࢹ͓͖ͯ͠ɺωοτϫʔΫϦϯΫͷঢ়گ ʹదԠͤ͞Δɻ
     ෦෼త৴པੑͷ͋Δ഑৴ͳΒ࠶ૹΧ΢ϯτͱλΠϜΞ΢τΛద੾ʹઃఆ͢Δɻ )BQQZ
     8FC35$
     -*'&

124. ࢀߟจݙ http://www.amazon.co.jp/hpbn/dp/4873116767 ! http://www.html5rocks.com/en/tutorials/webrtc/infrastructure/ ! http://www.html5rocks.com/ja/tutorials/webrtc/datachannels/ ! http://simpl.info/rtcdatachannel/ ! http://www.slideshare.net/iwashi86/20140801-web-rtcmeetup3r3

     ! https://docs.google.com/presentation/d/ 1MkvmX6Gvb1cRATdwF4RFBtol8NgdnblwlwikDnFhT10/present#slide=id.p ! http://html5experts.jp/mganeko/5554/ ! http://iwashi.co/2014/05/13/trickleice/ !