webrtcのiceについて知る

WebRTCの ICEについて知るWebRTC Meetup Tokyo #8

@iwashi86

1https://www.flickr.com/photos/aigle_dore/9997830314/in/photolist-getuCJ-rg9FSw-6uBXPM-qwVxdJ-9tAAku-qHWCTA-bxJrqC-dS3syZ-9RJHEB-9Tat6g-brUZ2W-dQiKoY-94RzU2-a3vmK9-ARR9p-9dyqtW-bqP5CT-p1QhWZ-dY6Bc-qZF5JW-pCNaK2-r8RWZ1-e5yb2Y-pPwGje-qFdRn8-bCydpc-oyvuRF-9bGQh8-azfu9R-j84fLK-bCfjjM-j4iWqn-a2tskF-9cMFBB-9vQwHT-javNQn-4mvLq4-9ebMGG-5YXb27-brB37c-qfpb6C-5RkFbC-nbXBRH-dVbBu5-jcL8uM-9et1Uh-7GM2YH-ngBXEo-hw2twQ-qwPYgR

2

Yoshimasa Iwase@iwashi86

3https://www.flickr.com/photos/greenzowie/10543956045/in/photolist-h4JwMB-j3VKs2-qRZg9A-dyU1Aj-7xGMri-a3iFh-qXmB7S-rhDn4V-q3suF7-e1RHSP-68fqSC-7ruUn2-ae2UU7-6sNyov-bs1UAR-5NFbEx-6x1iU4-jqxvkh-s7ZpTn-sprJAv-4gQGMG-9cTcKt-9eYajw-9eY88L-j6KiKx-nLCY-kaLpYw-jwBa1M-jqxxiW-m87EZd-bvhe9u-9qUQtS-66EUvV-kPBhPH-9ofV2b-qXSDJd-941EoN-q4qefm-m3yYoj-s7Ze5P-jMgAvU-rvMzu3-bQDzMZ-9kgKBS-dJdSKY-9cgWri-brom8Z-sppYe2-de3BTr-jnoSt5

WebRTCの ICE？(Interactive Connectivity Establishment)

よくある説明

4

5

http://iwashi.co/2014/05/13/trickleice/

6

http://iwashi.co/2014/05/13/trickleice/

7

受注開発納品

8

受注開発納品

WebRTC 案件

9

受注開発納品

開発完了 -> 動作確認 OK ！

10

受注開発納品

ん？つながらない？

11https://www.flickr.com/photos/ro_buk/4207903199/in/photolist-7pQB2a-7oP9vq-8xbiHx-7Ajmwj-8zemoB-7ehuXP-94aHzE-93jvSN-5gCQp-nRdqb-7ESvZP-5eMSN-4izRk-gdCx68-7H5QhG-hm25eq-gdCArW-gdCvG6-99Q3YA-gdD9sZ-4iA9c-8uzbUL-7hWskX-24apZ-6JCtXT-765WDT-7cpma4-765UzM-8wAnxv-8xtXNE-23HQ3r-79kxLp-9uu261-6JgUhP-62GZde-6HTovP-7xJsr-tXPfoF-6JkZB3-3aWJ47-6JkZtY-5fFxrT-5fKTRL-bzSKLU-RTQ8y-hGmu1-5fKTgm-5fFvFn-3D3gk9-769MNG

WebRTCであるよくわからないけどつながらないやつだ…

12https://www.flickr.com/photos/gumuz/7340412/in/photolist-DC3Q-6kqoV-9Lgf8x-naaGzP-pWzqNK-6kWVRg-oEZ6w8-8v7VGZ-9UEAmi-9kLv-ehYbxv-o6Ad1A-4DqFKJ-bRcWii-d1tJTm-4aHjs6-bJWNFP-97Pgho-8ZNBGe-rLYSXs-ajroY-96qUSC-4kAXcy-8QdCZt-r7MDtF-57tLjY-4Zhpz-9vjHhs-88hnSm-9fpiLc-bnc22E-Khua8-e4onL9-8QfuUe-fCyJ3-nzr4bo-7YvGrd-6pThCu-4bbmiz-cPhDnL-81rSz4-9Lj31N-81FuTC-jRVD8h-dYkr3t-8QVpAV-dhwwUe-8nJQUH-b8qzsB-bwhMsd

早く原因を調べなさい

13https://www.flickr.com/photos/ro_buk/4207903199/in/photolist-7pQB2a-7oP9vq-8xbiHx-7Ajmwj-8zemoB-7ehuXP-94aHzE-93jvSN-5gCQp-nRdqb-7ESvZP-5eMSN-4izRk-gdCx68-7H5QhG-hm25eq-gdCArW-gdCvG6-99Q3YA-gdD9sZ-4iA9c-8uzbUL-7hWskX-24apZ-6JCtXT-765WDT-7cpma4-765UzM-8wAnxv-8xtXNE-23HQ3r-79kxLp-9uu261-6JgUhP-62GZde-6HTovP-7xJsr-tXPfoF-6JkZB3-3aWJ47-6JkZtY-5fFxrT-5fKTRL-bzSKLU-RTQ8y-hGmu1-5fKTgm-5fFvFn-3D3gk9-769MNG

WebRTCの通信の中身とかよくわからんし・・・

14

_(:3 」∠ )_

15https://www.flickr.com/photos/jar0d/14758011307/in/photolist-ou7EAP-5wyd2j-ijH3Kj-9qtG1H-4yAsJE-nCwyJ6-bvcewH-7tfKKm-nsFpRX-reQpF2-pH36Cq-fmAtiU-jeLrpR-e3jcFm-dKmtwE-69VSTe-d5joAm-xWZbG-cpwuvu-ghWjGP-MPHno-fL1t9y-hAbUa2-owD33K-arqcdX-iNUwBE-ehaxYy-8rfCd6-r5sAwo-bJHtS4-aE9vC2-662Gv6-aSDJg-aCrxxV-6PKpsp-6TM1kv-dGPHKP-4urjtC-6nQD8s-eYoDZu-kBuiEM-8cpE6r-gGyLHr-73DaN5-aHiPFi-bRje26-p8bJiq-o4JNX8-6EJK2H-7RGfyR

「 NATで落ちてるだけですよ」とか簡単に言える＆対処できる

16

ICE 知る＝大事

17

略

19

長すぎ

ちなみに SIP は約 270 ページ

20

_(:3 」∠ )_

21https://www.flickr.com/photos/greenzowie/10543956045/in/photolist-h4JwMB-j3VKs2-qRZg9A-dyU1Aj-7xGMri-a3iFh-qXmB7S-rhDn4V-q3suF7-e1RHSP-68fqSC-7ruUn2-ae2UU7-6sNyov-bs1UAR-5NFbEx-6x1iU4-jqxvkh-s7ZpTn-sprJAv-4gQGMG-9cTcKt-9eYajw-9eY88L-j6KiKx-nLCY-kaLpYw-jwBa1M-jqxxiW-m87EZd-bvhe9u-9qUQtS-66EUvV-kPBhPH-9ofV2b-qXSDJd-941EoN-q4qefm-m3yYoj-s7Ze5P-jMgAvU-rvMzu3-bQDzMZ-9kgKBS-dJdSKY-9cgWri-brom8Z-sppYe2-de3BTr-jnoSt5

アイスを

22https://www.flickr.com/photos/nam2_7676/4437691249/

美味しく召し上がれるように

23

平易に解説

24

セッションのゴールICE を理解して

自身の仕事等に活かす

25

そもそもなぜ ICE が必要？

26

NAT 越えしたいから

Internet

NAT NATDropped…

27

UPnPPCPICE

28

UPnPPCPICE

29

ICEVanilla

Trickle

30

ICEVanilla

Trickle

拡張

31

ICEVanilla

Trickle標準化されてないけど、 Chrome/Firefox で動く

拡張

32

ICEVanilla

Trickle標準化されてないけど、 Chrome/Firefox で動く

拡張

1. ICE概要

2. ICE kwsk

33

1. ICE概要

2. ICE kwsk

34

35

収集

( 初期値 )

交換

整頓

穴開

終結

再開

36

収集

交換

整頓

穴開

終結

再開

通信できそうな候補 (IP&Port)をありったけ集める

37

収集

交換

整頓

穴開

終結

再開

集めた候補を相手と交換する

38

収集

交換

整頓

穴開

終結

再開

相手から受け取った候補と自分の候補をペアにして

一手間加えて `uniq & sort`

39

収集

交換

整頓

穴開

終結

再開

ペアに対して、お互いにひたすら

接続試行（ホールパンチ）

40

収集

交換

整頓

穴開

終結

再開ホールパンチ中で未知の候補ペア

が見つかっちゃうことも…（後述）

41

収集

交換

整頓

穴開

終結

再開

接続成功した候補ペアからイケてる候補を決定

42

収集

交換

整頓

穴開

終結

再開

リロードとかすると振り出しに戻る

43

収集

交換

整頓

穴開

終結

再開

1. ICE概要

2. ICE kwsk

44

45

収集

交換

整頓

穴開

終結

再開

46https://www.flickr.com/photos/dwinton/15491767/in/photolist-2npar-fN8mrJ-6ZSNQW-3cEJD6-baVv4K-5cvQgk-fLdzPf-c4hNUA-gn15cX-hbvc2u-i45cJV-oyhaRk-3NJ8q1-iG9ei4-6R5CsQ-dkbFo7-4ambAb-4sf4jZ-fZieCr-dpSjMb-7kPv8B-8KQdNv-549Ffr-anZ9V5-5GDdt-an8sRH-8Dk7Hw-pi6wZh-dfk7z6-8xwVAa-p7t5bk-3cHnsS-jCAuX-3nzdyJ-6Nqpba-uQweU-og5QH4-cyGuyU-dmBq2P-7kTpqm-5eRh4E-oWSAMV-h5KBm-oP7Sx5-fZsXjr-fZt4rY-fZsXnH-7kPvaK-8t9P2Y-o7GXcz

収集(gathering / harvesting)

47

ICE Candidate ( 候補 ) is 何 ?

48

ICE Candidate ( 候補 ) is 何 ?・ IP アドレス

・プロトコル (TCP/UDP)・ポート番号・コンポーネント・タイプ（後述）・優先度・ファウンデーション・ベース

後述

49

NAT

STUN

TURN

（この構成で説明）

50

NAT

STUN

TURN

まずローカル候補 GET （ソケットをbind ）

ex. 10.10.1.2 udp 50001 type host

51

NAT

STUN

TURN

STUN を利用して NAT 外部★の候補をGET

　 ex. 100.1.2.3 udp 50002

52

NAT

STUN

TURN

Turn に Allocation Request するex. 200.7.8.9 udp 60000

53

・ 10.10.1.2 udp 50001 ・ 100.1.2.3 udp 50002・ 200.7.8.9 udp 60000

今まで集めた候補

54

ICE にはもっと情報がある

整理しよう

55

IP Proto Port Type Component Foundation priority base

10.10.1.2 udp 50001

100.1.2.3 udp 50002

200.7.8.9 udp 60000

ICE 候補の詳細

56


10.10.1.2 udp 50001 host

100.1.2.3 udp 50002 srlfx

200.7.8.9 udp 60000 relay

ICE 候補の詳細

host = ローカルの候補srlfx = STUN を使って入手した候補relay = TURN を使って入手した候補

srlfx = Server Reflexive の略

57


10.10.1.2 udp 50001 host 1

100.1.2.3 udp 50002 srlfx 1

200.7.8.9 udp 60000 relay 1

ICE 候補の詳細

ICE(RFC5245) 的にいえばRTP = 1 、 RTCP = 2

なので実は・・・

58


10.10.1.2 udp 50001 host 1

100.1.2.3 udp 50002 srlfx 1

200.7.8.9 udp 60000 relay 1

10.10.1.2 udp 50003 host 2

100.1.2.3 udp 50004 srlfx 2

200.7.8.9 udp 60001 relay 2

ICE 候補の詳細

2 倍ある。だが、 SRTP と SRTCP は MUX するのでたぶん WebRTC で後者は使われてない

59


10.10.1.2 udp 50001 host 1 0※

100.1.2.3 udp 50002 srlfx 1 4

200.7.8.9 udp 60000 relay 1 8

10.10.1.2 udp 50003 host 2 0※

100.1.2.3 udp 50004 srlfx 2 4

200.7.8.9 udp 60001 relay 2 8

ICE 候補の詳細

Foundation はホールパンチを効率化するために利用「※」は NW 特性が類似しておりどっちかやれば十分

60


10.10.1.2 udp 50001 host 1 0※ 126|32542|255

100.1.2.3 udp 50002 srlfx 1 4 100|31518|255

200.7.8.9 udp 60000 relay 1 8 2|31518|255

10.10.1.2 udp 50003 host 2 0※ 126|32542|254

100.1.2.3 udp 50004 srlfx 2 4 100|31518|254

200.7.8.9 udp 60001 relay 2 8 2|31518|254

ICE 候補の詳細

どの候補を一番優先して使うのか決めるための値(2^24)*(type preference) + (2^8)*(local preference) + (2^0)*(256 - component ID)

61


10.10.1.2 udp 50001 host 1 0※ 126|32542|255 10.10.1.2:20001

100.1.2.3 udp 50002 srlfx 1 4 100|31518|255 10.10.1.2:20002

200.7.8.9 udp 60000 relay 1 8 2|31518|255 200.7.8.9:60000

10.10.1.2 udp 50003 host 2 0※ 126|32542|254 10.10.1.2:20003

100.1.2.3 udp 50004 srlfx 2 4 100|31518|254 10.10.1.2:20004

200.7.8.9 udp 60001 relay 2 8 2|31518|254 200.7.8.9:60001

ICE 候補の詳細

後述する無駄な候補を省くために利用

62


10.10.1.2 udp 50001 host 1 0※ 126|32542|255 10.10.1.2:20001

100.1.2.3 udp 50002 srlfx 1 4 100|31518|255 10.10.1.2:20002

200.7.8.9 udp 60000 relay 1 8 2|31518|255 200.7.8.9:60000

10.10.1.2 udp 50003 host 2 0※ 126|32542|254 10.10.1.2:20003

100.1.2.3 udp 50004 srlfx 2 4 100|31518|254 10.10.1.2:20004

200.7.8.9 udp 60001 relay 2 8 2|31518|254 200.7.8.9:60001

ICE 候補の詳細

後述する無駄な候補を省くために利用

63


10.10.1.2 udp 50001 host 1 0※ 126|32542|255 10.10.1.2:20001

100.1.2.3 udp 50002 srlfx 1 4 100|31518|255 10.10.1.2:20002

200.7.8.9 udp 60000 relay 1 8 2|31518|255 200.7.8.9:60000

10.10.1.2 udp 50003 host 2 0※ 126|32542|254 10.10.1.2:20003

100.1.2.3 udp 50004 srlfx 2 4 100|31518|254 10.10.1.2:20004

200.7.8.9 udp 60001 relay 2 8 2|31518|254 200.7.8.9:60001

　全部そろったら

64https://www.flickr.com/photos/112931986@N07/11645894595/in/photolist-iK7fJ8-iK7g1R-4VHLyS-4VDvUg-on4f7G-85vph4-4Gf3qe-eiVJYf-sxTLu-4Gjd2Q-aqEiTw-57pb1e-q2cD1t-9cce2F-3aaovf-m3JXZ4-7bTeix-rJbSsy-zFtQB-auHyEc-fp5sj-9WnTF2-e8hKvL-e8hJZG-3GL7F-CUiRW-66NVLJ-Ngx8o-SUXKY-cMaWHS-cMaWTm-cMaWF3-cMaWP9-cMaWRm-cMaWLf-5iVTqa-4W486H-atGuRo-cWA4LG-XAztd-8yxAxg-8ogyfG-9fbbF-4zzX2i-o893on-8743uP-sAMhW-5bQEmS-kLRTZb-8KtxA3

シグナリングで交換

65https://www.flickr.com/photos/112931986@N07/11645894595/in/photolist-iK7fJ8-iK7g1R-4VHLyS-4VDvUg-on4f7G-85vph4-4Gf3qe-eiVJYf-sxTLu-4Gjd2Q-aqEiTw-57pb1e-q2cD1t-9cce2F-3aaovf-m3JXZ4-7bTeix-rJbSsy-zFtQB-auHyEc-fp5sj-9WnTF2-e8hKvL-e8hJZG-3GL7F-CUiRW-66NVLJ-Ngx8o-SUXKY-cMaWHS-cMaWTm-cMaWF3-cMaWP9-cMaWRm-cMaWLf-5iVTqa-4W486H-atGuRo-cWA4LG-XAztd-8yxAxg-8ogyfG-9fbbF-4zzX2i-o893on-8743uP-sAMhW-5bQEmS-kLRTZb-8KtxA3

みんな大好き SDP でね！

66

収集

交換

整頓

穴開

終結

再開

67

IP Proto Port Type

10.10.1.2

udp 50001 host …

100.1.2.3

udp 50002 srlfx …

200.7.8.9

udp 60000 relay …

IP Proto Port Type

10.10.9.9

udp 50001 host …

100.1.9.9

udp 50002 srlfx …

200.7.8.9

udp 60002 relay …

自分のリスト

相手からもらったリスト

２種類のリストが手元に揃う

68

IP Proto Port Type

10.10.1.2 udp 50001 host …

100.1.2.3 udp 50002 srlfx …

200.7.8.9 udp 60000 relay …

IP Proto Port Type

10.10.9.9 udp 50001 host …

100.1.9.9 udp 50002 srlfx …

200.7.8.9 udp 60002 relay …

自分のリスト

相手からもらったリスト

組み合わせる (Paring up)

69

Local IP Remote IP

10.10.1.2 … 10.10.9.9 …

100.1.2.3 … 10.10.9.9 …200.7.8.9 … 10.10.9.9 …

10.10.1.2 … 100.1.9.9 …

… … … …

作成したリストに対してuniq & sort ( 優先度順 )

70

なぜ重複排除？

NAT STUN

STUN

NAT 有

NAT 無

71


NAT STUN

STUN

NAT 有

NAT 無

異なるアドレス

72


NAT STUN

STUN

NAT 有

NAT 無

73


NAT STUN

STUN

NAT 有

NAT 無同一のアドレス

（＝無駄）

74

Local IP Remote IP

10.10.1.2 … 10.10.9.9 …

100.1.2.3 … 10.10.9.9 …200.7.8.9 … 10.10.9.9 …

10.10.1.2 … 100.1.9.9 …

… … … …

お互いにチェックリストを持ったらついに…

Local IP Remote IP

10.10.1.2 … 10.10.9.9 …

100.1.2.3 … 10.10.9.9 …

200.7.8.9 … 10.10.9.9 …

10.10.1.2 … 100.1.9.9 …

… … … …

自分相手

75http://upload.wikimedia.org/wikipedia/commons/b/b3/BattleofLongisland.jpg

開戦！


注：ただの UDPホールパンチです


ICEは STUNパケットで UDPホールパンチ

STUN

STUN

78

( 途中で ) 未知との遭遇

NAT NAT

List List

79

( 途中で ) 未知との遭遇

Symmetric

NAT

ConeNAT

List List

持ってるリストに記載されていない送信元アドレスから STUN パケットが届くこと

がある

⇒ Type: Peer Reflexive 候補の発見

80

Local IP Remote IP

10.10.1.2 … 10.10.9.9 …

100.1.2.3 … 10.10.9.9 …200.7.8.9 … 10.10.9.9 …

10.10.1.2 … 100.1.9.9 …

… … … …

終わると、成功・失敗がわかる

Local IP Remote IP

10.10.1.2 … 10.10.9.9 …

100.1.2.3 … 10.10.9.9 …

200.7.8.9 … 10.10.9.9 …

10.10.1.2 … 100.1.9.9 …

… … … …

自分相手

81

収集

交換

整頓

穴開

終結

再開

82

使うペアを制御側がFlag 付き STUN で教える

USE-CANDIDATE 付き STUN

Success Response

以降、 DTLS Handshake…

83

ICEVanilla

Trickle

拡張

84

収集

( 初期値 )

交換

整頓

穴開

終結

再開

GET した候補はすぐ送る、すぐ試す！（もしかしたら早くつながるかもしれ

ない）

特に違うところ

85https://www.ietf.org/proceedings/86/slides/slides-86-mmusic-8.pdf

86https://www.ietf.org/proceedings/86/slides/slides-86-mmusic-8.pdf

87

ということで

88

ICE 知る＝大事

89

ICE 知る＝大事といっても、 ICE にはまだまだ話せていないことがたくさ

んあるState Machine 、 Triggered Check 、 Authentication(ufrag 等 )

90

おしまい！

webrtcのiceについて知る

Technology