SlideShare una empresa de Scribd logo
1 de 34
C-LIS CO., LTD.
M100でWebRTCアプリ
開発
Vuzix Developer Conference
有限会社シーリス 有山 圭二
WebRTCとは
3
Web Real-Time Communication
World Wide Web Consortium(W3C)が提唱するリアルタイムコミュニケーシ
ョン用のAPIの定義で、プラグイン無しでウェブブラウザ間のボイスチャッ
ト、ビデオチャット、ファイル共有ができる。
(Wikipedia https://ja.wikipedia.org/wiki/WebRTC)
WebRTCとぼく
4
Google社主催のWebRTCハッカソンに参加。
当時はまだChromeにExperimentalとして実装されていた
ボスが来た
WebRTC構成
6
Peer 2 Peer
音声・ビデオ
WebRTC構成
Peer 2 Peer
Signaling Server
7
音声・ビデオ
WebRTC構成(ICE: Interactive Connectivity Estblishment)
Peer 2 Peer
Signaling Server
STUN(Session Traversal Utilities for NAT) Server
8
音声・ビデオ
WebRTC構成
Signaling Server
TURN(Traversal Using Relay around NAT) Server
音声・ビデオ
9
WebRTCとは
10
Web Real-Time Communication
World Wide Web Consortium(W3C)が提唱するリアルタイムコミュニケーシ
ョン用のAPIの定義で、プラグイン無しでウェブブラウザ間のボイスチャッ
ト、ビデオチャット、ファイル共有ができる。
(Wikipedia https://ja.wikipedia.org/wiki/WebRTC)
WebRTCとブラウザ
11
バージョン 対応状況
Chrome 47 ○
Firefox 42 ○
Safari 9 ×(プラグイン)
Internet
Explorer 11 ×(プラグイン)
Microsoft
Edge 25.10586 ○
Android
WebView 5.x〜 ○
Mobile Safari 9.1 ×
出典:JavaScriptoon 2 WebRTC~知識ゼロから5日でボイスチャットを作れた技術
発行: TechBooster 執筆者: @mzsm_j
Safari(Webkit)もようやく……
12
https://webkit.org/status/?utm_content=bufferd7cfd&utm_medium=social&utm_source=twitter.com&utm_campaign=buffer#specification-webrtc
M100でWebRTC
13
ブラウザ?
ネイティブ?
M100 の OS
14
Android 5系未満なので
ブラウザによる
WebRTC対応無し
OpenWebRTC by EricssonResearch
15
https://github.com/EricssonResearch/openwebrtc
OpenWebRTC
16
http://www.openwebrtc.org/
• H.264とVP8コーデックに対応
(GStreamerベース)
• クロスプラットフォーム
• 2条項BSDライセンス
デモ
STUN Server
stun.l.google.com:19302
18
Signaling Server
http://demo.openwebrtc.org:38080
19
WebRTC構成(ICE: Interactive Connectivity Estblishment)
Peer 2 Peer
Signaling Server
STUN(Session Traversal Utilities for NAT) Server
20
音声・ビデオ
ハマったところ
ライブラリの追加
22
https://github.com/EricssonResearch/openwebrtc-examples/wiki/Developing-Android-apps
dependencies {
compile fileTree(include: ['*.jar'], dir: 'libs')
testCompile 'junit:junit:4.12'
compile 'io.openwebrtc:openwebrtc-android:0.3'
}
今はリポジトリにあるのでjar不要
https://github.com/EricssonResearch/openwebrtc-
examples/blob/master/android/Native/app/build.gradle
23
dependencies {
compile fileTree(include: ['*.jar'], dir: 'libs')
testCompile 'junit:junit:4.12'
compile 'io.openwebrtc:openwebrtc-android-sdk:0.1.0'
}
android-sdkが別にある
https://github.com/EricssonResearch/openwebrtc-
examples/blob/master/android/NativeCall/app/build.gradle
24
ビルドエラー
25
SDKのAndroidManifest.xmlに
プロパティが設定されているのが原因
<manifest
package="com.vuzix.samplewebrtc.android"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<application
android:allowBackup="false"
android:configChanges="orientation|keyboard|keyboardHidden|screenSize"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
tools:replace="android:allowBackup">
ビルドエラー
26
AndroidHttpClient is deprecated
ビルドはできるけど、あまり気持ちよいものではない
HttpUrlConnectionに置き換えた
27
/**
* Shutdown the process as a workaround until cleanup has been fully implemented.
*/
@Override
protected void onStop() {
finish();
System.exit(0);
}
なぞのコードが……
android {
compileSdkVersion 22
buildToolsVersion "22.0.1"
defaultConfig {
applicationId "com.ericsson.research.owr.examples.nativecall"
minSdkVersion 19
targetSdkVersion 22
versionCode 1
versionName "1.0"
ndk {
abiFilter "armeabi-v7a"
}
}
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_7
targetCompatibility JavaVersion.VERSION_1_7
}
build.gradle
29
対応アーキテクチャがARMのみ!
30
https://github.com/EricssonResearch/openwebrtc
Intel CPUには非対応(M300は……?)
https://www.vuzix.com/Products/m300-smart-glasses
31
M300はAndroid 6がベース
https://www.vuzix.com/Products/m300-smart-glasses
32
WebRTCサンプルコード(M100向け)は、
GitHubで公開予定
https://github.com/vuzixtokyo
33
C-LIS CO., LTD.
各製品名・ブランド名、会社名などは、一般に各社の商標または登録商標です。
本資料中では、©、®、™を割愛しています。
本資料は、有限会社シーリスの著作物であり、
クリエイティブコモンズの表示-非営利-継承 3.0 Unported ライセンスの元で公開しています。

Más contenido relacionado

Similar a Vuzix Developer Conference

レポート
レポートレポート
レポート
xin song
 
レポート
レポートレポート
レポート
xin song
 
SkyWayとWebRTC開発者コミュニティ4年間の軌跡とCMC_Meetupで学んだこと、実践したこと
SkyWayとWebRTC開発者コミュニティ4年間の軌跡とCMC_Meetupで学んだこと、実践したことSkyWayとWebRTC開発者コミュニティ4年間の軌跡とCMC_Meetupで学んだこと、実践したこと
SkyWayとWebRTC開発者コミュニティ4年間の軌跡とCMC_Meetupで学んだこと、実践したこと
Yusuke Naka
 
JavaプログラマのためのWebSocket概要
JavaプログラマのためのWebSocket概要JavaプログラマのためのWebSocket概要
JavaプログラマのためのWebSocket概要
Shumpei Shiraishi
 

Similar a Vuzix Developer Conference (20)

WebRTC再び
WebRTC再びWebRTC再び
WebRTC再び
 
レポート
レポートレポート
レポート
 
レポート
レポートレポート
レポート
 
WebRTC概説(P2P)
WebRTC概説(P2P)WebRTC概説(P2P)
WebRTC概説(P2P)
 
ビデオ通話・P2Pがコモディティ化する世界 WebRTCによるこれからを探る
ビデオ通話・P2Pがコモディティ化する世界 WebRTCによるこれからを探るビデオ通話・P2Pがコモディティ化する世界 WebRTCによるこれからを探る
ビデオ通話・P2Pがコモディティ化する世界 WebRTCによるこれからを探る
 
WebRTCとPeer.jsを使った実装
WebRTCとPeer.jsを使った実装WebRTCとPeer.jsを使った実装
WebRTCとPeer.jsを使った実装
 
WebRTC Boot Camp (WebRTC Conference Japan 2016) 事前公開版
WebRTC Boot Camp (WebRTC Conference Japan 2016) 事前公開版WebRTC Boot Camp (WebRTC Conference Japan 2016) 事前公開版
WebRTC Boot Camp (WebRTC Conference Japan 2016) 事前公開版
 
Magic Leap で WebRTC 触ってみた
Magic Leap で WebRTC 触ってみたMagic Leap で WebRTC 触ってみた
Magic Leap で WebRTC 触ってみた
 
5分でわかるWebRTCの仕組み - html5minutes vol.01
5分でわかるWebRTCの仕組み - html5minutes vol.015分でわかるWebRTCの仕組み - html5minutes vol.01
5分でわかるWebRTCの仕組み - html5minutes vol.01
 
Web OSで可能になる世界
Web OSで可能になる世界Web OSで可能になる世界
Web OSで可能になる世界
 
クラウドサービスを使って作る動画サイト?
クラウドサービスを使って作る動画サイト?クラウドサービスを使って作る動画サイト?
クラウドサービスを使って作る動画サイト?
 
SkyWayとWebRTC開発者コミュニティ4年間の軌跡とCMC_Meetupで学んだこと、実践したこと
SkyWayとWebRTC開発者コミュニティ4年間の軌跡とCMC_Meetupで学んだこと、実践したことSkyWayとWebRTC開発者コミュニティ4年間の軌跡とCMC_Meetupで学んだこと、実践したこと
SkyWayとWebRTC開発者コミュニティ4年間の軌跡とCMC_Meetupで学んだこと、実践したこと
 
WebRTCについて
WebRTCについてWebRTCについて
WebRTCについて
 
スマホ(Android・iPhone)でWebRTC
スマホ(Android・iPhone)でWebRTCスマホ(Android・iPhone)でWebRTC
スマホ(Android・iPhone)でWebRTC
 
Webによるデバイスを用いたリアルタイムサービスの可能性(神戸ITフェスティバル版)
Webによるデバイスを用いたリアルタイムサービスの可能性(神戸ITフェスティバル版)Webによるデバイスを用いたリアルタイムサービスの可能性(神戸ITフェスティバル版)
Webによるデバイスを用いたリアルタイムサービスの可能性(神戸ITフェスティバル版)
 
5分で分るWebRTCコーデックウォーズ
5分で分るWebRTCコーデックウォーズ5分で分るWebRTCコーデックウォーズ
5分で分るWebRTCコーデックウォーズ
 
About WebRTC
About WebRTCAbout WebRTC
About WebRTC
 
はじめてのAzure Web App for Containers! -コンテナの基礎から DevOps 環境の構築まで-
はじめてのAzure Web App for Containers! -コンテナの基礎から DevOps 環境の構築まで-はじめてのAzure Web App for Containers! -コンテナの基礎から DevOps 環境の構築まで-
はじめてのAzure Web App for Containers! -コンテナの基礎から DevOps 環境の構築まで-
 
ひとつひとつ組み上げてみていくビデオチャットアプリのアーキテクチャ
ひとつひとつ組み上げてみていくビデオチャットアプリのアーキテクチャひとつひとつ組み上げてみていくビデオチャットアプリのアーキテクチャ
ひとつひとつ組み上げてみていくビデオチャットアプリのアーキテクチャ
 
JavaプログラマのためのWebSocket概要
JavaプログラマのためのWebSocket概要JavaプログラマのためのWebSocket概要
JavaプログラマのためのWebSocket概要
 

Más de Keiji Ariyama

Google Mirror API勉強会 20130607
Google Mirror API勉強会 20130607Google Mirror API勉強会 20130607
Google Mirror API勉強会 20130607
Keiji Ariyama
 
これからの"日付変更線"の話をしよう
これからの"日付変更線"の話をしようこれからの"日付変更線"の話をしよう
これからの"日付変更線"の話をしよう
Keiji Ariyama
 

Más de Keiji Ariyama (10)

Android Studio開発講座
Android Studio開発講座Android Studio開発講座
Android Studio開発講座
 
2015年のAndroidアプリ開発入門 - ABCD 2015 Kanazawa
2015年のAndroidアプリ開発入門 - ABCD 2015 Kanazawa2015年のAndroidアプリ開発入門 - ABCD 2015 Kanazawa
2015年のAndroidアプリ開発入門 - ABCD 2015 Kanazawa
 
Realmの暗号化とAndroid System
Realmの暗号化とAndroid SystemRealmの暗号化とAndroid System
Realmの暗号化とAndroid System
 
Android Studioの魅力
Android Studioの魅力Android Studioの魅力
Android Studioの魅力
 
Vuzix developer conference - M100アプリ開発
Vuzix developer conference - M100アプリ開発Vuzix developer conference - M100アプリ開発
Vuzix developer conference - M100アプリ開発
 
Google Glassアプリ開発と自由度の変遷
Google Glassアプリ開発と自由度の変遷Google Glassアプリ開発と自由度の変遷
Google Glassアプリ開発と自由度の変遷
 
Google Cloud Endpointsによる API構築
Google Cloud Endpointsによる API構築Google Cloud Endpointsによる API構築
Google Cloud Endpointsによる API構築
 
Google Mirror API勉強会 20130607
Google Mirror API勉強会 20130607Google Mirror API勉強会 20130607
Google Mirror API勉強会 20130607
 
これからの"日付変更線"の話をしよう
これからの"日付変更線"の話をしようこれからの"日付変更線"の話をしよう
これからの"日付変更線"の話をしよう
 
20130119 adkハンズオン発表資料
20130119 adkハンズオン発表資料20130119 adkハンズオン発表資料
20130119 adkハンズオン発表資料
 

Último

Último (12)

知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
 
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
 
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
 
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
 
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
 
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
 
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアルLoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
 
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイスLoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
 
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
 
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
 
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半        2024/04/26の勉強会で発表されたものです。新人研修 後半        2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
 
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native IntegrationsUtilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
 

Vuzix Developer Conference