webrtc/ortcの最新動向まるわかり！

Copyright © NTT Communications Corporation. All right reserved.

HTML5 ConferenceWebRTC/ORTC 最新動向まるわかり！

NTTコミュニケーションズナカユウスケ

2015年1⽉25⽇


⾃⼰紹介

u 名前：仲裕介（@Tukimikage）

u 所属：NTTコミュニケーションズ技術開発部

u コミュニティワーク：

html5j⾃動⾞部部⻑http://automotive.html5j.org

WebRTC Meetup Tokyo 主催http://webrtcjp.info/

2


⾃⼰紹介

u オフィシャルワーク１

HTML5 Experts.jpの運営

・HTML5に特化したWeb技術者向け情報メディア

・⽇本最⾼峰のWebエキスパート、コントリビューターによる情報発信

3

http://html5experts.jp


⾃⼰紹介

u オフィシャルワーク２

WebRTC開発者向けプラットフォームSkyWayの開発・運営

・2013年12⽉5⽇に提供開始・約1100名の開発者が利⽤・詳しくは後ほど！

4

https://skyway.io


本⽇の内容

u 概要編u WebRTCとはu WebRTCの技術要素

u 標準化編u WebRTC標準化の進め⽅u 最新の標準化動向

u ORTC編u ORTCとはu ORTCの歴史u ORTCの技術仕様u ORTCの今後

u 活⽤事例編u WebRTC活⽤事例u デモンストレーション

u 最後に

5


想定読者・聴者

1. WebRTC/ORTCについては名前を聞いたことがあるレベル、機会があれば触ってみたいと思っている⼈

2. WebRTC/ORTCについてはそれなりに知っているが、業界の最新動向をひと通り頭に⼊れておきたい⼈

3. WebRTC/ORTCは完全マスター！バリバリコードも書いてて、最新動向もバッチリ！

4. それ以外

6

7Copyright © NTT Communications Corporation. All right reserved.

概要編

WebRTCとは


HTML5の全体像

HTML5が提供する機能は多岐にわたる。WebRTCはその⼀つの技術。

8

引⽤元：http://www.slideshare.net/dynamis/web-standards-infographics


WebRTCとは（概要）

n ひとことで⾔うと「ブラウザでテレビ電話を実現する技術」n ブラウザだけで、プラグインのインストール無しに、Web会議、

ボイスチャット、テキストチャット、ファイル転送、電話との連携等が実現可能。

9

従来のWeb WebRTC

カメラやマイクを利⽤可

リアルタイムに送受信

ブラウザ間の直接通信

サーバ⇔クライアント間の通信

リクエストとレスポンスの

繰り返し

カメラやマイクの利⽤不可

サーバサーバ


WebRTCとは（技術⾯）

技術的には2つの側⾯がある。

1. ⾳声、映像、データのリアルタイム・コミュニケーションのオープン標準l 従来のサービス(WebEx、Skype等)は互換性がなく、独⾃技術を含む。

WebRTCは相互接続が保証され、ライセンス使⽤料が不要。

l 以下の内容が定められた。

① ⾳声と映像の形式(コーデック)

② ネットワーク機器(NAT、Firewall等)を越えて直接通信するための⼿順

③ 暗号化、到達保証、順序制御、流量・輻輳制御を実現するプロトコル

2. ブラウザとネイティブアプリの両⽅で利⽤できるl WebRTC対応ブラウザにURLを⼊⼒するだけで、WebRTCを利⽤したサービス

を利⽤できる。

l オープンソースのC++のコードを利⽤しコンパイルすれば、ネイティブアプリにWebRTC機能を組み込むこともできる。

10


WebRTCとは（ビジネス⾯）

ビジネス⾯では以下の3つの影響がある。

1. リアルタイム・コミュニケーションのオープン標準• マルチデバイス、マルチOSのコミュニケーション系サービスを開発する際の

WebRTCの活⽤が始まり、徐々に拡⼤している。• IoT分野で、リアルタイム通信が必要な場合に、WebRTC採⽤の

機器も登場している。

2. ブラウザで利⽤できる• インストール不要なため、サポートコストの削減や低ITリテラシ層の利⽤が可能。• HTML5、JavaScriptの記述だけで動作するため、既存のWebサービスや社内シス

テムとの連携や組み込みが容易。

3. 電話との連携• WebRTCを端末⇔ゲートウェイ間で利⽤することにより、電話と連携できる。

コンタクトセンタ分野にもWebRTCが適⽤できる。


WebRTCの対応状況

12

対応状況 OS アプリ備考✔ Windows Chrome✔ Windows Firefox テレビ電話機能も搭載✘ Windows IE

2014年10⽉に開発着⼿を発表ORTCが実装される予定

✔ Windows ネイティブ要コンパイル✔ Mac Chrome✔ Mac Firefox テレビ電話機能も搭載✘ Mac Safari 標準化に参加し始めたらしい✔ Mac ネイティブ要コンパイル✔ Android Chrome✔ Android Firefox✔ Android 標準ブラウザ Android 5.0で対応✔ Android ネイティブ要コンパイル✘ iOS Chrome✘ iOS Safari 標準化に参加し始めたらしい✔ iOS ネイティブ要コンパイル


概要編

WebRTCの技術要素


WebRTCの仕組み

14

WebRTCと⼀⾔で⾔っても様々な技術が使われている。仕組みを順に追いながら、使⽤されている技術要素を⾒ていく。

１．ICE

２．シグナリング

３．P2Pによるセキュアなリアルタイム通信

４．⾳声、映像処理


WebRTCの仕組み

15

１．ICE






ICE(Interactive Connectivity Establishment)

16

NA

T

NA

T

STUNサーバ

Signalingサーバ

STUNサーバ

WebRTC Cli WebRTC Cli

• WebRTCクライアント同⼠がPeerToPeerでネットワークを介してつながるために必要な仕組みを提供する

・STUN・⾃分のグローバルIP、

ポート番号を知る・UDPホールパンチングという

仕組みでNATに⽳を開ける・NATの種類を判定

（WebRTCでは使ってない）

・TURN・どうしてもNATに⽳を開けら

れない場合に、データ通信を中継する仕組み

・WebRTCコネクション全体の8〜9%はTURNが必要と⾔われている

TURNサーバ



17

• UDPホールパンチング

NAT

STUN

NAT



18


俺のグローバルIPとポート番号

教えて

111.111.111.111 50000番やで NAT

STUN

NAT



19


俺のグローバルIPとポート番号

教えて

222.222.222.222 20000番やで

NAT

STUN

NAT

IP:111.111.111.111PORT:10000番



20


NAT

STUN

NAT

IP:111.111.111.111PORT:10000番

IP:222.222.222.222PORT:20000番

互いのIPとPORTを何らかの⼿段で交換



21


NAT

STUN

NAT

IP:222.222.222.222PORT:20000番

IP:111.111.111.111PORT:10000番

アクセスさせてー！だめー。

⽳開いた！



22


NAT

STUN

NAT

IP:222.222.222.222PORT:20000番

IP:111.111.111.111PORT:10000番

通れる！！アクセスさせてー。

⽳開いた！



23


NAT

STUN

NAT

IP:222.222.222.222PORT:20000番

IP:111.111.111.111PORT:10000番

もしかして！通れる！！



24

• STUNとTURNの使いどころ

これらNATの仕組みについてはこちらの資料がオススメ！「WebRTCの裏側にあるNATの話」（@iwashi86）ー http://goo.gl/Ps2p0i

NATType

フルコーン制限付きフルコーン

ポート制限付きフルコーン

シンメトリック

フルコーン STUN STUN STUN STUN *1

制限付きフルコーン

STUN STUN STUN STUN *2

ポート制限付きフルコーン

STUN STUN STUN TURN

シンメトリック

STUN *1 STUN *2 TURN TURN

※厳密に細分化すると９パターンあります。

*1 2015/1/26修正*2 2017/2/13修正


WebRTCの仕組み

25

１．ICE






シグナリング

26

NA

T

NA

T

STUNサーバ

Signalingサーバ

STUNサーバ


• ICEの仕組み等を利⽤して取得した情報を、互いにやりとりするために必要な情報を交換する仕組み

・どのような仕組みを⽤いても良い・WebSocket・XHRロングポーリング・SIP・⼿動（笑）

・情報はSDP（Session Description Protocol）を⽤いて情報交換する・テキストベースのプロトコル・IPアドレス、ポート番号、

映像、⾳声コーデック情報などを記載して交換する


WebRTCの仕組み

27

１．ICE






P2Pによるセキュアなリアルタイム通信

28

• すべての準備が整うとP2Pによる通信を開始

・P2P接続を維持するために、接続後も裏で定期的にSTUNへの通信やSDP情報の交換が⾏われる

・DTLS・通信経路暗号化・データ整合性の保証・認証⾏為は⾏わない（オレオレ証明書）

・映像・⾳声・セキュアなリアルタイム通信（SRTP）・AES（共通鍵暗号化）・鍵交換にDTLSを⽤いる（DTLS-SRTP）

・データ・TCP同様の信頼性、到達順序性、フロー制御、

輻輳制御をUDP上で実現・セキュアなDTLS上で動作する

NA

T

NA

T

STUNサーバ

Signalingサーバ

STUNサーバ


IPUDP

SCTPSRTPDTLS

⾳声・映像データ


WebRTCの仕組み

29

１．ICE






⾳声、動画処理

30

• WebブラウザはPCの⾳声映像ストリームにアクセスできる

・getUserMedia（WebAPI）プラットフォーム上の⾳声、映像ストリームを取得できるw3cによって規定されたAPI

・ブラウザに実装されたエンジンによって、エンコード、デコード処理がなされる

・コーデック・Video*1：VP8、H.264・Audio：Opus、G.711 PCMA & PCMU

※1 2014/11のIETF91で、Webブラウザは両⽅のコーデックを搭載することと決まった。

デバイスハードウェア

⾳声処理エンジンコーデック

ジッタ/パケロス補正エコー除去

ノイズリダクション

映像処理エンジンコーデック

ジッタ/パケロス補正⾳声・動画同期

画像補正

⾳声キャプチャ動画キャプチャ

内部WebRTC API

WebAPI（W3C）

引⽤元：オライリー・ジャパン「ハイパフォーマンスブラウザネットワーキング」 P.301


標準化編WebRTC標準化の進め⽅


W3CとIETFによる標準化

n WebRTCとIETFによって標準化が進められている。

• W3C• Web Real-Time Communications Working Group• http://www.w3.org/2011/04/webrtc/• Webブラウザに実装するAPIの標準化を担当する

• IETF• Real-Time Communication in WEB-browsers Working Group• http://tools.ietf.org/wg/rtcweb/• プロトコルレベルでの標準化を担当する• オーディオやビデオのコーデック、セキュリティ、JSEP、ICE、データ通信プロトコル等

の標準化を担当する

32

今回は主にW3Cに関しての標準化を取り上げます


W3Cによる標準化

n W3Cによる標準化のロードマップ

33

WebRTC 1.0

Media Capture and Streams

MediaStreamRecording

MediaStreamImage Capture

MediaStreamDepth Stream

Extensions

Identifiers for WebRTC’s

Statistics API

※W3C公式のWorking draftになっているものだけ記載

2013/9/10Working Draft

2014.12013.6 2014.6 2015.1

2014/12/5Editor’s Draft

2015.6



2015 1QLast Call








W3Cによる標準化

n W3Cによる標準化のロードマップ

34

WebRTC 1.0


MediaStreamRecording

MediaStreamImage Capture

MediaStreamDepth Stream

Extensions

Identifiers for WebRTC’s

Statistics API

※W3C公式のWorking draftになっているものだけ記載


2014.12013.6 2014.6 2015.1


2015.6



2015 1QLast Call







Media Capture Task Forceが標準を担当（WebRTC WGとDeviceAPIs WG合同のTF）


W3C標準化動向

n W3Cで議論中の主要なAPI

35

WebRTC 1.0

p RTCPeerConnection APIØ ICEの仕組みを利⽤してリモートのPeerと接続する機能を提供するØ リモートのPeerとの間でストリームの送受信を⾏うØ リモートのPeerとの間で任意のデータの送受信を⾏う


p MediaStream APIØ マイクやカメラなどのローカルマルチメディアデバイスへの、

アクセス⼿段を提供するØ 取得したメディストリームを管理するための機能を提供する


W3C標準化動向

n W3Cで議論中の主要なAPI

36

WebRTC 1.0

p RTCPeerConnection APIØ ICEの仕組みを利⽤してリモートのPeerと接続する機能を提供するØ リモートのPeerとの間でストリームの送受信を⾏うØ リモートのPeerとの間で任意のデータの送受信を⾏う


p MediaStream APIØ マイクやカメラなどのローカルマルチメディアデバイスへの、

アクセス⼿段を提供するØ 取得したメディストリームを管理するための機能を提供する

getUserMediaもこちら


標準化編最新の標準化動向


W3C標準化動向

n 標準化の場でどのような議論がなされているのか？

• 2013/11/12＠TPAC2013 オフライン・ミーティングü 中国深セン

• 2014/05/19-21＠オフライン・ミーティングü アメリカワシントンDC

• 2014/10/30-31＠TPAC2014 オフライン・ミーティングü アメリカワシントンDC

⾊々な話題が議論されているが、私が考える重要項⽬を４つピックアップ

引⽤元：http://html5experts.jp/alan-iida/11325/


W3C標準化動向

n WebRTC Stats APIの提案• 様々な統計情報を収集するAPI• 2014/10のTPACで提案がなされる

ü 統計情報としてどのような情報を開発者は知りたいのか？ü 必要性を含めて継続してディスカッションする必要あり

• 2014/5のオフミで継続議論ü いくつかのAPIが提案される

ü ICEに関する様々情報を収集するAPIü メディアストリームに関する様々情報を収集するAPIü https://www.w3.org/2011/04/webrtc/wiki/Stats

• 2014/10/21に最初のWorkingDraftをリリースü http://www.w3.org/TR/2014/WD-webrtc-stats-20141021/

Ø ピア・ツー・ピア接続で送信されるオーディオ・ビデオ・データパケットの損失やネットワークの遅延状況など、潜在的なネットワークの性能を、WebRTCアプリケーションで監視するためのAPIを提供する。

39


W3C標準化動向

n DTLS Key Controlの提案• DTLSの証明書はPeer⾃⾝が本⼈であることを証明するもの

（現在はブラウザが⾃動⽣成するオレオレ証明書だけど・・）• これを、WebCryptoAPIを利⽤して⽣成できるようにするAPI

を提案• 利⽤イメージ

theKey = RTCKeys.generate(algorithm);pc = new RTCPeerConnection({ dtlsKeys: [ theKey ] } );

• WebCryptoAPIが公開鍵暗号（楕円曲線暗号⽅式）に対応しているかどうかが課題となり、議論は先送りに（2014.10 TPAC）

40

引⽤元：https://www.w3.org/2011/04/webrtc/wiki/images/f/f3/Keys.pdf


W3C標準化動向

n RTCRtpSender / RTCRtpReceiver の提案• SDPを扱うための新しいアプローチとしてGoogleから提案• メディアストリームをトラックという概念で扱い、

RTPSender/Receiverオブジェクトに紐付けて管理することで、メディアを扱いやすく（エンコードパラメータ変更やトラックの追加削除、複製等が簡単に）する

• ORTCで提案された仕様がまさにこれ• WebRTC1.0でどこまで取り込むかはこれから議論

41

引⽤元：https://www.w3.org/2011/04/webrtc/wiki/images/6/6c/WebRTC_RTCSender-Receiver%2C_TPAC_2014.pdf


W3C標準化動向

n Promises利⽤の提案• WebRTC 1.0仕様書の中の⼀部のAPI並びに、

getUserMedianでは、callbackの記述⽅法としてPromisesが推奨になった

• エラー処理の集中とネストが深くならないようにするnavigator.mediaDevices.getUserMedia({ video: true }).then(stream => pc1.addStream(v1.srcObject = stream)).then(() => pc1.createOffer()).then(offer => pc1.setLocalDescription(offer)).then(() => pc2.setRemoteDescription(pc1.localDescription)).then(() => pc2.createAnswer()).then(answer => pc2.setLocalDescription(answer)).then(() => pc1.setRemoteDescription(pc2.localDescription)).then(() => log(“Connected!”)).catch(reason => log(“Failed to connect! ” + reason.message));

引⽤元：https://www.w3.org/2011/04/webrtc/wiki/images/9/97/ModernWebRTC.pdf


ORTC編ORTCとは

D（NTT Comグループ限り）


ORTCとはなにか？

n 現⾏のWebRTC1.0のイケてない点を改善すべく提案されたもう⼀つのRTC API

n Robin RaymondとErik Lagerway（HookflashというRTCアプリの開発会社の同僚）の呼びかけで検討がスタート

44


WebRTCのなにがイケてないの？

n APIが⾼機能すぎるØ もっとローレベルなAPIが必要

n SDPフォーマットはレガシー＆難解であり可読性が良くないØ JSエンジニアにはがハードル⾼すぎる

n SDPにも様々な拡張がありサポートの有無が異なってくると相互運⽤性に問題が出てくるØ 私達はJSONを使う⽅法を提案する

n SDPのOffer/Answerモデルはピア同⼠がステートフルに情報を交換するため処理が複雑になるØ ステートレスなやりとりが必須である

n SDPのOffer/AnswerモデルはWebRTCのユースケースにマッチしない場合があるØ 例えば、あるピアから別のピアにメディアを配信する場合（双⽅向ではない場

合）も、双⽅向でSDP情報を交換する必要がある

45


WebRTCのなにがイケてないの？

46

引⽤元：http://blog.webrtc.is/2013/03/06/sdp-the-webrtc-boat-anchor/


褒めている部分もある

n WebRTCは標準化でシグナリングの⼿法を定めていないことØ 将来的に様々なプロトコルを⽤いることが出来るためとてもよい判断

だった

47


ORTC編ORTCの歴史



ORTCの歴史

n 歴史

49

※１ ORCA : Object RTC API Community Group※２ ORTC Draft：http://goo.gl/HuyLWL

2013.62013.1 2014.1 2014.6 2015.1

2013.7ORCA CG発⾜（※１）

2013はじめ検討開始

2013.11ORTC Draft公開（※２）2013.11IETF88でORTCのWalkthrough実施

2014.1ORTC Draft更新

2014.2ORTC CGに改名


2013.6IETFでDraft公開


ORTCの歴史

n 歴史

50


2013.62013.1 2014.1 2014.6 2015.1

Robin RaymondとErik Lagerwayの２

⼈で検討開始

2013.7ORCA CG発⾜（※１）








ORTCの歴史

n 歴史

51


2013.62013.1 2014.1 2014.6 2015.1

IETFのMLに問題点を投げてみたら、

「そこまで⾔うならDraft書けよ」というので、書いてみた2013.7

ORCA CG発⾜（※１）








ORTCの歴史

n 歴史

52


2013.62013.1 2014.1 2014.6 2015.1

Ciscoらがまずは現⾏のWebRTCの仕様をFIXさせることが最優先だと発⾔し、ペンディング状態に2013.7

ORCA CG発⾜（※１）








ORTCの歴史

n 歴史

53


2013.62013.1 2014.1 2014.6 2015.1

しかし、Micrrosoft、MS Open

Technologiesの賛同を得られて、CG発⾜

2013.7ORCA CG発⾜（※１）








ORTCの歴史

n 歴史

54


2013.62013.1 2014.1 2014.6 2015.1

参加メンバは43⼈余り、それなりに盛況

2013.7ORCA CG発⾜（※１）








ORTCの歴史

n 歴史

55


2013.62013.1 2014.1 2014.6 2015.1

このWalkthroughはかなり盛況だった。

GoogleでWebRTCに関わっている、Justin UbertiやPeter Thatcherらも、この時にORTC-CGに参加を表

明。

2013.7ORCA CG発⾜（※１）








ORTCの歴史

n 歴史

56


2013.62013.1 2014.1 2014.6 2015.1

CG初のFacetoFace Meetingが開催され、グループの名称を変更し

た

2013.7ORCA CG発⾜（※１）








MicrosoftがORTCを黎明期からサポートする訳

n MicrosoftはCU-RTC-WEBというAPIを独⾃提案していた• 特徴としては

ü MediaコーデックのMandatoryを決めないü RTCPeerConnectionというピア同⼠のコネクションを抽象化する

⼿法を取っていないü セッション制御にJSEP/SDPを採⽤していないü メディア並びにリアルタイム通信を取り扱うブラウザコンポーネ

ントへ直接アクセスが出来るローレベルAPIを⽤意

57

W3CのWebRTC WGでこの提案を取り込むかどうかの投票が⾏われ、賛成票が４票、反対票が２２票で不採⽤に。

不採⽤になった理由は、ローレベルAPIを直接操作できることに対して、セキュリティ⾯での懸念点がある、ということ。

しかしながら・・・・


MicrosoftがORTCを黎明期からサポートする訳

n MicrosoftはCU-RTC-WEBというAPIを独⾃提案していた• 特徴としては

ü MediaコーデックのMandatoryを決めないü RTCPeerConnectionというピア同⼠のコネクションを抽象化する

⼿法を取っていないü セッション制御にJSEP/SDPを採⽤していないü メディア並びにリアルタイム通信を取り扱うブラウザコンポーネ

ントへ直接アクセスが出来るローレベルAPIを⽤意

58

W3CのWebRTC WGでこの提案を取り込むかどうかの投票が⾏われ、賛成票が４票、反対票が２２票で不採⽤に。

不採⽤になった理由は、ローレベルAPIを直接操作できることに対して、セキュリティ⾯での懸念点がある、ということ。

しかしながら・・・・

CU-RTC-WebはORTCと設計思想が似ているため、サポートを表明したのではないか？

あくまで推測ですが。


ORTC編ORTCの技術仕様


ORTCの技術仕様

n ORTCが出た当初からORTC陣営が⾔っていること• 仕様⾯

ü SDPを直接JavaScriptで操作することはないü ステートレスにリアルタイム通信を⾏うためのAPI設計ü H.264/SVCなどのモバイルにやさしいコーデックを推奨

• 実装⾯ü モバイル・アプリケーションとのプロトコルの互換性を担保ü キャリアスケールオペレーションに必要な監視、診断機能を⽤意ü サーバサイドのORTC Client実装をリファレンス提供ü STUN/TURNの認証管理の仕組みを提供ü オーディオ、ビデオのミキシングの仕組みをリファレンス提供

等

60


ORTCの技術仕様

n ORTCの仕様書で定義されているオブジェクト群

61

垂直⽅向の⽮印：メソッドとイベントのやりとり⽔平⽅向の⽮印：メディアやデータのやり取り


ORTCの技術仕様


62


DTLSによるデータ転送を司るオ

ブジェクト DTLSのコネクションからRTPパケットを取り出すリスナー


ORTCの技術仕様


63


ICEを利⽤して接続先候補を収集し、⼀番効率がよいルートで

接続を⾏うSTUN、TRUNの仕組みも活⽤


ORTCの技術仕様


64


MediaStreamのコントロール（送信や停⽌等）を⾏う

MediaStreamのコントロール（受信や停⽌等）を⾏う


ORTC編ORTCの今後



WebRTCとの融合

n 昨年のTPACでのRTCRtpSender / RTCRtpReceiver の提案があったように、今後WebRTCと融合していく⽅向で議論が進んでいる

n WebRTC 1.1または2.0では、ORTC陣営のアイディアが取り込まれ、よりよいRTC API仕様ができるだろう。

66

ORTCについての詳細はこちらhttp://ortc.org/


活⽤事例編

WebRTC活⽤事例


n BistriSNSと連携しているワンクリックコールサービス。URLを生成してそこにアクセスした人とビデオチャットが出来る。

Facebook, Google+, Windows Live, Yahoo, Jabber対応

サービスとしての活⽤事例


n MistCDNブラウザ間でコンテンツをシェアするCDNサービス。日本の学生ベンチャー。

サービスとしての活⽤事例


n Frozen MountainWebRTCを利用したサービスを開発するためのSDK（IceLink）を提供。Chrome、FirefoxだけではなくiOSとIEでもWebRTCの機能を利用可能とするライブラリとなっている。

プラットフォームとしての活⽤事例


n Weemoビデオチャットを既存のアプリケーションに埋込むためのSDKとクラウドを提供。Safari、IE、Firefox、Chrome、Android、iOSに対応。



n tokboxFace-to-Faceのコミュニケーションを実現する、OpenTokというプラットフォームと開発者向けのライブラリを提供。今年は、Firefoxと連携しFirefox Helloを提供。



RequestecFlash、SIPとWebRTCを相互連携できるSDKとAPIを提供する。JavaScript, Flash, iOSとAndroidに対応。ユーザ認証等の機能も提供。



Add LiveWebRTC開発者向けのSDK、シグナリングなどのクラウド・サービス、IEやiOSにも対応するWebRTCクライアントライブラリ、アナリティクス、エンタープライズに対応するサポートなどを提供する。

5000以上の案件、250000ユーザー、2000000分／月アプリが利用されている。



BrowsetelWebPhoneやClick-to-Call、Web Conferenceなどの機能を簡単に組み込むことが可能なクラウド・サービスを提供。



NA

T

NA

T76

SkyWayは、WebRTC活⽤サービスの提供者向けのフレームワーク。複雑なシグナリング処理を担うAPI群とライブラリで構成される。

n2013年12⽉5⽇に提供開始n約1100名の開発者が利⽤n提供内容

• シグナリングAPI• NAT越えAPI (=STUN)• ライブラリ(オープンソース)

STUNAPI

SignalingAPI

STUNAPI

ライブラリライブラリ

開発者はPeer to Peer通信のプログラミングに専念できる

SkyWayがシグナリングを

担うので、



DialogicPowerMedia XMSというサーバソフトウェアを提供。WebRTCとSIP Deviceで通話する際のシグナリングやコーデックのトランスコード（VP8からH.264）、メディアのレコーディング、ミキシング等を行うサーバを簡単に構築する事ができる。コンタクトセンター向けソリューション。

ベンダー製品としての活⽤事例

引⽤元：http://www.dialogic.com/en/landing/webrtc.aspx

・JAVA製ソフトウェア（CentOSやRHREで動作可能）・Audioは同時1000セッション、Videoは同時450セッション


callstats.ioWebRTCを活用したビデオ会議等提供事業者向け（スタートアップ、エンタープライズ向け）に、映像品質のリアルタイムコントロール、遅延等の常時監視機能を提供する。

運⽤系としての活⽤事例


IoT分野での活⽤事例

• ビデオ会議機能を備えた遠隔操作ロボット。• Double Robotics社、Romotive社のロボットは、WebRTC技術を採⽤。• 難病で登校できない⼦供が、学校に配備されたロボットを利⽤するなどの事例もある。

(VGo社)

79

Romo by Romotivewww.romotive.jp

¥15,660ロボット側はiPhoneに、操作側は

ChromeとFirefoxに対応。

Double by Double Roboticswww.doublerobotics.com

$2,499ロボット側はiPadに、

操作側はiPadとChromeに対応。


活⽤事例編

デモンストレーション


コンシューマ向けWeb会議

• インストール不要、認証も不要、URLにアクセスするだけで開始。• ビデオの場合は8⼈まで、オーディオのみの場合は

20⼈までの、グループチャットに対応。

818181

SkyWaySkyWayでシグナリング

WebRTCでメッシュ状に接続し、マイク⾳声、カメラ映像を

すべての相⼿に送信

WebRTC Chat on SkyWaychat.skyway.io

2014年4⽉21⽇サービス開始


スマホで撮った多数の映像を表⽰

• 2000⼈規模のカンファレンス(HTML Conference 2013)会場でスマホで撮った約150名の来場者の顔を、壇上のスクリーンに表⽰した。

82

SkyWay

SkyWayでシグナリング

カメラの映像をWebRTCで送信

HTML5 JUMBOTRONjt.skyway.io


ゲーム

n CUBE SLAM• WebRTCを活⽤したオンライン対戦型エアホッケー• https://www.cubeslam.com

83


ビジネス向けWeb会議

n GoToMeeting• https://free.gotomeeting.com/

84


Firefox

n Firefox Hello• https://www.mozilla.org/ja/firefox/hello/

n Firefoxでスクリーンシェア• https://talky.io/

ü ChromeではExtensionやAppsでできることは有名ü Firefoxも33から対応ü AddonをインストールかMozillaに申請し、ドメインをホワイトリ

ストに追加してもらう必要あり

85


データチャネル

n データチャネル系• MistCDN

ü http://www.mist-t.co.jp/ü WebRTCを利⽤したCDNサービス

86


ORTC

n ORTCデモ• http://html5labs.interoperabilitybridges.com/prototype

s/object-rtc/object-rtc/info• 動作させるにはWin端末が必要なので、今回は記事でご紹介

ü http://qiita.com/Tukimikage/items/f75617b81501eba86093

87


最後に・・・


WebRTC Conference Japan開催決定！

89

⽇本初のカンファレンス、海外からのゲストも多数参加します！

http://webrtcconference.jp


ご清聴ありがとうございました。

webrtc/ortcの最新動向まるわかり！

Internet