skyway handson
Post on 09-Jul-2015
745 Views
Preview:
DESCRIPTION
TRANSCRIPT
Copyright © NTT Communications Corporation. All right reserved.
SkyWay HandsOn
WebRTC Meetup Tokyo #5
https://atnd.org/events/58755
Copyright © NTT Communications Corporation. All right reserved.
自己紹介
なかゆうすけ（Twitter : @Tukimikage）
所属
• NTTコミュニケーションズ 技術開発部
オフィシャルワーク
• HTML5 Experts.jp（HTML5 Experts Works） 副編集長
• WebRTC開発者向けフレームワーク「SkyWay」中の人
コミュニティワーク
• html5j自動車部部長
• html5jエンタープライズ部スタッフ
Copyright © NTT Communications Corporation. All right reserved.
今日の流れ
WebRTC開発者向けプラットフォーム「SkyWay」の概要
ハンズオン事前準備
作るものの概要
開発しよう！
Copyright © NTT Communications Corporation. All right reserved.
SkyWayの概要
SkyWayを使えば簡単にWebRTCのアプリを開発できる
Copyright © NTT Communications Corporation. All right reserved.
SkyWayの概要
WebRTC利用アプリを簡単に開発できるクラウド基盤
2013年12月5日に提供開始
無料！
提供内容
• シグナリング等のAPI
• ライブラリ
• サンプルアプリ
• ドキュメント
開発者登録
• 専用APIキーの払い出し
• 利用状況の確認
http://skyway.io
Copyright © NTT Communications Corporation. All right reserved.
WebRTCはWeb開発者にとって難しい技術
ブラウザ間で直接通信する前に、サーバ経由で「シグナリング」を行う必要があり、実装にはネットワークの知識が必要。
6ようやく直接通信できる
これらの通信が完了してから…
Copyright © NTT Communications Corporation. All right reserved.
SkyWayの特徴
SkyWayのシグナリングAPIとライブラリが複雑な処理を担うので、開発者は簡単にWebRTC利用アプリを開発できる。
STUNAPI
SignalingAPI STUN
API
ライブラリ ライブラリ
APIとライブラリが複雑な処理を担う
Copyright © NTT Communications Corporation. All right reserved.
開発に必要な情報
クライアントライブラリの日本語ドキュメント
• クライアントはオープンソースのPeerJS互換
• PeerJSのドキュメントに一部修正を加え日本語化して公開中
http://nttcom.github.io/skyway/docs/
Copyright © NTT Communications Corporation. All right reserved.
開発に必要な情報
開発者向けフォーラムを用意
• SkyWay Technical Forum
だれでも参加可能！
中の人が懇切丁寧に開発者の疑問質問にお答え！
WebRTCに関す日本語での情報交換に活用してください
http://goo.gl/enBkcF
Copyright © NTT Communications Corporation. All right reserved.
ハンズオン事前準備
Copyright © NTT Communications Corporation. All right reserved.
ハンズオンを行う前に
ハンズオンの手引
http://goo.gl/oa3HP2
Copyright © NTT Communications Corporation. All right reserved.
作るものの概要
Copyright © NTT Communications Corporation. All right reserved.
簡単マルチパーティビデオチャットアプリ
SkyWaySkyWayでシグナリング
WebRTCを利用しメッシュ状に接続ビデオチャットをおこなう
※APIキー毎にルームを作る
Copyright © NTT Communications Corporation. All right reserved.
開発しよう！
Copyright © NTT Communications Corporation. All right reserved.
STEP1
・APIキーは各自取得したものを設定・利用可能ドメインに localhost を設定・TURNサーバに関する設定は空白
Copyright © NTT Communications Corporation. All right reserved.
STEP2
Copyright © NTT Communications Corporation. All right reserved.
STEP3
Copyright © NTT Communications Corporation. All right reserved.
STEP4
Copyright © NTT Communications Corporation. All right reserved.
STEP5
Copyright © NTT Communications Corporation. All right reserved.
STEP6
Copyright © NTT Communications Corporation. All right reserved.
STEP7
Copyright © NTT Communications Corporation. All right reserved.
STEP8
Copyright © NTT Communications Corporation. All right reserved.
STEP9
Copyright © NTT Communications Corporation. All right reserved.
STEP10
Copyright © NTT Communications Corporation. All right reserved.
STEP11
Copyright © NTT Communications Corporation. All right reserved.
STEP12
Copyright © NTT Communications Corporation. All right reserved.
STEP12
Copyright © NTT Communications Corporation. All right reserved.
ローカルで動かしてみる！
Ex http://localhost:8080
Copyright © NTT Communications Corporation. All right reserved.
STEP13
・APIキーを上記の者に書換える
Copyright © NTT Communications Corporation. All right reserved.
ローカルで動かしてみる！
Ex http://localhost:8080
Copyright © NTT Communications Corporation. All right reserved.
ウィンドウはいっぱい出てくるけど映像が出ないはず
Copyright © NTT Communications Corporation. All right reserved.
STEP14
・TURNサーバの設定を追加（このTURNサーバはOSSのものを今回の為に用意）
Copyright © NTT Communications Corporation. All right reserved.
STEP15
・configを書換える
Copyright © NTT Communications Corporation. All right reserved.
つながったかな？
Copyright © NTT Communications Corporation. All right reserved.
以上です。
Copyright © NTT Communications Corporation. All right reserved.
SkyWayで素敵なWebRTCライフを！
top related