スマートフォンでの WebRTC活用
- 1.
- 2. 2 自己紹介 源 拓洋 （みなもとたくみ） 2014年新卒 電気電子システム工学専攻 趣味はハードウェア設計・製作 経験が多いのはAndroidアプリ開発
- 3. 3 Agenda WebRTC Native Codepackage の紹介 WebRTCアプリ開発の勘所 ネイティブアプリケーションのポイント
- 4. 4 Agenda WebRTC Native Codepackage の紹介 WebRTCアプリ開発の勘所 ネイティブアプリケーションのポイント
- 5. 5 ■Apps Chrome 29 (2013/08)- FireFox24 (2013/09)- Opera 20 (2014/03)- スマートフォンブラウザにおけるWebRTC Bowser(2012/10)- Ericsson社の WebRTC対応ブラウザ Androidのブラウザは”ほぼ”対応 しかし、実際には動かないケースも… iOS App Android ■Built-in WebView v36- (Android L)
- 6.
- 7. 7 WebRTCを利用したスマホアプリを作成可能 WebRTC Native Codepackage • GoogleのChrome向けWebRTC実装がベース • Opera, Mozila, Intel, ARM, MIPS, TemasysさんなどがAUTHORS • BSDライクなライセンスでロイヤリティフリー WebRTCを実装したNative Codeパッケージ
- 8. 8 利用方法 ネイティブアプリケーションに組み込んで利用する WebRTC Native Codepackageソースコード取得 ライブラリファイル生成 アプリケーションへの組み込み *.jar ファイル*.a ファイルiOS Android アプリケーションに内包される
- 9.
- 10.
- 11. 11 サンプルアプリケーション iOS AndroidBrowser 取得したソースコードの中にAppRTCDemoというサンプルが含まれている AppRTCDemo -https://apprtc.appspot.com/ WebRTC標準？アプリケーション ライブラリを疑う質問をすると二言目に「AppRTCDemoもだめ？」と聞かれる ライブラリをビルドした際には必ずAppRTCDemoで動作確認を行ってから利用する
- 12. 12 “Install Prerequisite software”と書かれているのは サンプルビルドについて AppRTCDemoのビルド方法は下記URLにまとまっている http://www.webrtc.org/native-code →ライブラリは同時にビルドされる $gitclone https://chromium.googlesource.com/chromium/tools/depot_tools.git $export PATH=`pwd`/depot_tools:"$PATH“ AppRTCDemoが *.ipa or *.apk 形式で出力される
- 13. 13 Agenda WebRTC Native Codepackage の紹介 WebRTCアプリ開発の勘所 ネイティブアプリケーションのポイント
- 14.
- 15. 15 ただし、情報の鮮度には要注意！ WebRTC email list 情報共有の場としてはdiscuss-webrtcというgoogleグループがある https://groups.google.com/forum/#!forum/discuss-webrtc ビルドツールの使い方（ビルドオプションなど） Constraintsの設定 想定外の挙動への対処（使い方の問題） セグメンテーション違反への対処
- 16. 16 WebRTC Native Codepackageの取り扱い デバイスや通信はPeerConnectionFactoryが持ってる ユーザープログラム(Java,Obj-C)の立ち位置はJavascript 直接ブラウザのレイヤーに干渉できず、ConstraintsやSDPを通じて制御することになる 映像・音声の加工はライブラリ自体を改変することになる (WebAudioは当然無い) PeerConnectionFactory カメラ マイクエンコーダ/デコーダ 通信 ユーザープログラム PeerConnection 描画系 PeerConnectionFactory = ブラウザと考える 下記の様な処理を意識する必要は無い • アコースティックエコーキャンセラ • オートゲインコントロール • 帯域やCPU負荷に応じた動画制御
- 17. 17 感覚的な話 Javascriptより近くて、直接からは遠い存在 Native制御系 ユーザープログラム Native制御系 Javascript Javascriptエンジン インターフェイス ブラウザ Native Codepackage 距離感の違い 時々落ちる よく落ちる 滅多に落ちない
- 18.
- 19. 19 セグメンテーションエラー２ カメラ メディア処理 メディア処理描画系 メディア処理 ＼はーい／＼次のフレーム来たよ／ ＼次のフレーム来たよ！・・・あれ！？／ ＼はーい／＼次のフレーム来たよ／ カメラ メディア処理 ＼あれ！？／ カメラと描画系が落ちる要因の２強 native non-native 間の密接な接点
- 20. 20 N人接続 PeerConnectionFactory PeerConnection PeerConnection NativeアプリにおいてもN人接続は可能 リソース破棄の実装に悩む • サンプルは無い →最近Android版AppRTCDemoにカメラ切り替えが載ったのは参考になる •破棄する順序や処理を誤るとセグメンテーションエラーで落ちる →3人つないで一人落とすときに全員落ちる →アプリが実は正常終了していない • カメラ、描画系の扱いには特に注意 できるから、あきらめないで。 PeerConnection
- 21.
- 22.
- 23.
- 24.
- 25. 25 Agenda WebRTC Native Codepackage の紹介 WebRTCアプリ開発の勘所 ネイティブアプリケーションのポイント
- 26.
- 27. 27 MCU/SFU P2P SFU MCU P2P • Web会議のようなサービスを展開する場合、 複数のPeerと映像を送受信することとなる • モバイルの場合はよりリソースがシビアになる SFU(Selective Forwarding Unit) • Peerは必要な映像/音声を選択的に受け取る • Peerの上りストリームは1つだけ • 全員の音声を一本に合成できるものもある MCU (Multi-point Control Unit) • 複数の映像/音声を合成し一本にまとめる • Peerの上りと下りストリームは1つずつ
- 28.
- 29. 29 ユースケース ブラウザと連携させて スマホならでは？ • コミュニケーションアプリ (PUSH通知という強み) •セミナーアプリ (DataChannelで資料共有？) • Web会議アプリ (PeerConnectionを複数つくれば…) • 監視ソリューション (デスクトップ共有機能の応用) • ゲーム (ブラウザがコンソール、スマホがコントローラ等) • ファイル転送/共有 (NFC/Bluetooth/GPSなどを使ってシグナリング)
- 30. 30 OpenWebRTC Ericssonが開発したGStreamerベースのWebRTC実装 BSD二条項ライセンス クロスプラットフォーム(iOS/Android/Mac/Linux) GoogleGlassなどでも動作する http://www.ericsson.com/research-blog/tag/webrtc/ 最近RaspberryPiでも動くようになったらしい RaspberryPi = 3800円Linuxボード https://twitter.com/OpenWebRTC/status/544842113012477952 IoTにWebRTC？…
- 31. 31 まとめ メリット デメリット • Video/Audioを使ったiOS/Androidアプリが容易に実装可能になっている • ブラウザとも通信できるという大きなメリット •スマートフォンのハードウェアを生かし、ネイティブならではの実装も可能 • DataChannelと組み合わせて… • シグナリングの実装はブラウザより悩む • 「ネイティブだから映像/音声が容易に加工できる」は間違い • ちょっと変わったことをしようとすると辛い
- 32.