5分でわかるWebRTC

Copyright © NTT Communications Corporation. All right reserved.
Enterprise APIs Hack Night #1
５分で 
わかる 
WebRTC NTTコミュニケーションズ株式会社大津谷

自己紹介 / 大津谷亮祐（おおつやりょうすけ）
仕事
WebRTCプラットフォーム 
SkyWay”のプロダクトマネージャ
コミュニティ
WebRTC Conference Japan 幹事
プライベート
神奈川県葉山町在住 
趣味は海と畑
2

今日話すこと
1. WebRTCはパワフルな技術
2. でも意外とめんどくさい
3. WebRTCプラットフォーム便利
3

RTCって何の略語？
WebRTC
Web Real Time Communication
Webでネットでリアルタイムな(意思疎通 | 通信) 
をするためのオープン標準
4

リアルタイムコミュニケーションの歴史
リアルタイム・コミュニケーションと言えば電話。
120年の間、電話会社が独占
5 www.flickr.com/photos/mattb_tv/2550476978

NapsterやSkypeがインターネット上で
リアルタイム・コミュニケーションを実現。
電話会社とハッカーによる寡占が10年続いた。
6 www.flickr.com/photos/132889348@N07/18410514419

WebRTCによって、リアルタイム・コミュニケーションが
すべてのソフトウェアエンジニアの手に。
リアルタイム・コミュニケーションの民主化
7 www.flickr.com/photos/tjflex/57210112

母親に説明するとしたら
ホームページの中でテレビ電話が 
使える技術なんやで。
LINEっぽいものも簡単に作れるんやで。
8

まじめに知りたい人向け
n オープン標準の中身は、 
①
音声と映像のコーデック 
②
NAT越えの手順 
③
暗号化、到達・順序保証、流量・輻輳制御を 

実現するプロトコル 
④
ブラウザ内のJavaScript API
n ブラウザとアプリの両方で使える。 
(マルチデバイス、マルチプラットフォーム)
n 映像／音声とデータの両方を送れる。
9

デモ準備
n ChromeかFirefoxでアクセス！
n Windows、Mac、Android、Chrome OSに対応。 
iOSには未対応。 

Wi-Fi
: TechLabPAAK / recruit!!
URL
: is.gd/html5jt#0903!
10

何ができるの？
n コミュニケーションアプリが作れる
n 家電やIoTでも使える(右の写真)
n インストール不要だから、サポートが 
楽になる、ITが苦手な人も使える
n アプリやWebにビデオ／音声通話を 
組み込んでユーザ体験を向上できる
n 電話の発信と受信ができる
Chromecast
Withings Home
URL 
is.gd/html5jt#0903!
Wi-Fi
TechLabPAAK 

recruit!!

WebRTCの対応状況
12
n EdgeとiOSはもうちょっとかかる。
OS
アプリ
Windows Mac Android iOS
Chrome ✔ ✔ ✔ ✘
Firefox ✔ ✔ ✔
IE ✘*1
Edge ✘*2
Safari ✘*1*3 ✘*3
ネイティブアプリ ✔ ✔ ✔ ✔
*1:
プラグインで対応可
*2:
2015年7月のWindows 10発売時点で一部サポート
*3:
Ericsson等が推進する、オープンソースプロジェクト 
WebRTC in WebKit” により、開発がほぼ完了
URL 
is.gd/html5jt#0903!
Wi-Fi
TechLabPAAK 

recruit!!

イベント盛り上げ 
＆質疑応答アプリ
n  来場者の顔をスクリーンに表示、クリックすると通話
n  ハッカソンで半日で作った
13
SkyWay
SkyWayで 
シグナリング
カメラの映像を 
WebRTCで送信
HTML5 JUMBOTRON
jt.skyway.io!
URL 
is.gd/html5jt#0903!
Wi-Fi
TechLabPAAK 

recruit!!

Amazon Mayday
14
www.youtube.com/watch?v=X40j57v5g6I!

楽天生命ネット保険デスク
15
www.rakuten-life.co.jp/videochat/!
!

MistCDN / フジテレビオンデマンド
16
fod.fujitv.co.jp/s/fodlabo/!
n  著作権に配慮

V-Sido
n  人型ロボットを制御するミドルウェア
17
ぶしどう
www.asratec.co.jp/product/connect/webcon/!

BestieBox
n  グループ向けコミュニケーションアプリの 
無料ビデオ通話機能に採用
18
506506.ntt.com/smp_ap/bestiebox/!

NAT越えが大変なんです
19
私のIPを教えて
1.2.3.4:56789 
デス
NAT
STUN
NAT
アリスボブ

20
俺のIP何なん？
9.8.7.6:54321 
デス
NAT
STUN
NAT
アリスボブ

21
私のIPをボブに 
伝えて
アリスは 
1.2.3.4:56789 
デス
NAT
Signaling
NAT
アリスボブ

22
NAT
Signaling
NAT
アリスボブ
俺のIPをアリス 
に教えたって
ボブは 
9.8.7.6:54321 
デス

23
NAT
Signaling
NAT
アリスボブ
UDPで 
繋ぐわ来うへんな
UDPデスカ 
しばらく穴を 
空けマスネ
不審なアク 
セスデス！

24
NAT
Signaling
NAT
アリスボブ
NATに穴が 
開いたわ UDPで 
繋ぐで
さっきの戻り 
デスネ
UDPデスカ 
しばらく穴を 
空けマスネ

25
NAT
Signaling
NAT
アリスボブ
もう一度 
送るわ
NATに穴が 
開いたで
さっきの戻り 
デスネ

26
厳しいNAT
TURN
厳しいNAT
アリスボブ
代わりに 
ボブに 
届けて
TCPで 
サーバに繋ぐ 
のデスネ
よっこらショ 
忙しいデス
TCPで 
サーバに繋ぐ 
のデスネ

やってられるか！
27

便利なもの
n  WebRTCプラットフォーム
n  オープンソース
n  商用ソフト
28

SkyWay
n  WebRTCを利用するためのAPI群とSDKを提供。
n  日本語のドキュメントとフォーラム。
n  β版の間は無料。TURNも無料。
n  サーバはオープンソースのPeerJSの互換、Erlangで開発。
n  クライアントは、JavaScript、iOS、Androidに対応。
29
skyway.io

WebRTCを使って世界を変える
サービスを一緒に作ろう！
30

5分でわかるWebRTC

More Related Content

What's hot (20)

Viewers also liked (16)

Similar to 5分でわかるWebRTC (20)

More from Ryosuke Otsuya (11)

5分でわかるWebRTC