Copyright © NTT Communications Corporation. All right reserved.
WebRTC Meetup Tokyo #2
iPhoneでなんちゃってWebRTC
NTTコミュニケーションズ
先...
Copyright © NTT Communications Corporation. All right reserved.
自己紹介
名前:小松健作
所属:NTT communications
HTML5の研究開発
標準化活動(W3C)
H...
Copyright © NTT Communications Corporation. All right reserved.
WebRTC Chat on SkyWay
Copyright © NTT Communications Corporation. All right reserved.
Frequently Asked Question
“iPhoneでは
動かないん
ですか?“
4
・・・
Copyright © NTT Communications Corporation. All right reserved.
…
5
・・・
Copyright © NTT Communications Corporation. All right reserved.
そんなあなたにWeb Audio API + WebSocket
6
IE気にしなきゃ
おっけー
確信犯
Copyright © NTT Communications Corporation. All right reserved.
そんなあなたにWeb Audio API + WebSocket (cont)
7
Audio apiで
PCM取り...
Copyright © NTT Communications Corporation. All right reserved.
getUserMediaは
立派なWebRTCの機能です
( ´Д`)なにか?
8
確信犯
Copyright © NTT Communications Corporation. All right reserved.
DEMO
9
ちゃんと
動くといいなぁ
Copyright © NTT Communications Corporation. All right reserved.
もうちょい詳しく
10
getUserMedia()
MediaStreamSo
urce
ScriptProces...
Copyright © NTT Communications Corporation. All right reserved.
注意点(ダメな例)
var src = ctx. (stream);
var proc = ctx. ( , 1, ...
Copyright © NTT Communications Corporation. All right reserved.
動く書き方
var proc = ctx. ( , 1, 1);
proc. = (ev) {
}
$(“#hoge...
Copyright © NTT Communications Corporation. All right reserved.
今日の名言
13
バグは
仕様!!
確信犯
Upcoming SlideShare
Loading in …5
×

iPhoneでなんちゃってWebRTC

4,139 views

Published on

iPhoneで、なんちゃってWebRTC(getUserMedia + Web Audio API + WebSocket)なLT資料ですー

Published in: Technology
1 Comment
8 Likes
Statistics
Notes
No Downloads
Views
Total views
4,139
On SlideShare
0
From Embeds
0
Number of Embeds
257
Actions
Shares
0
Downloads
24
Comments
1
Likes
8
Embeds 0
No embeds

No notes for slide

iPhoneでなんちゃってWebRTC

  1. 1. Copyright © NTT Communications Corporation. All right reserved. WebRTC Meetup Tokyo #2 iPhoneでなんちゃってWebRTC NTTコミュニケーションズ 先端IPアーキテクチャセンタ 小松健作 2014年6月3日
  2. 2. Copyright © NTT Communications Corporation. All right reserved. 自己紹介 名前:小松健作 所属:NTT communications HTML5の研究開発 標準化活動(W3C) HTML5の啓蒙・コミュニティ運営 Google Developer Expert (HTML5)
  3. 3. Copyright © NTT Communications Corporation. All right reserved. WebRTC Chat on SkyWay
  4. 4. Copyright © NTT Communications Corporation. All right reserved. Frequently Asked Question “iPhoneでは 動かないん ですか?“ 4 ・・・
  5. 5. Copyright © NTT Communications Corporation. All right reserved. … 5 ・・・
  6. 6. Copyright © NTT Communications Corporation. All right reserved. そんなあなたにWeb Audio API + WebSocket 6 IE気にしなきゃ おっけー 確信犯
  7. 7. Copyright © NTT Communications Corporation. All right reserved. そんなあなたにWeb Audio API + WebSocket (cont) 7 Audio apiで PCM取り出す getUser Mediaとか WebSocket サーバー Audio apiで PCMデータか ら再生 WebSocket ですが何か? LTネタで しょ? ♫ ♫
  8. 8. Copyright © NTT Communications Corporation. All right reserved. getUserMediaは 立派なWebRTCの機能です ( ´Д`)なにか? 8 確信犯
  9. 9. Copyright © NTT Communications Corporation. All right reserved. DEMO 9 ちゃんと 動くといいなぁ
  10. 10. Copyright © NTT Communications Corporation. All right reserved. もうちょい詳しく 10 getUserMedia() MediaStreamSo urce ScriptProcessor oscillator ScriptProcessor destinationNodestreamオブジェクト destinationNode PCM (かるーく圧縮とか) PCM (かるーくデコード) 赤いところが Audio API
  11. 11. Copyright © NTT Communications Corporation. All right reserved. 注意点(ダメな例) var src = ctx. (stream); var proc = ctx. ( , 1, 1); proc. = (ev) { } src. (proc); proc. (ctx.destination); 11 FireFox以外だと、音が割れるだの途中で止まるだの Android ではブツブツ切れるだのほんと困ったちゃ んになっちゃう 残念な感じ になっちゃ うにゃ
  12. 12. Copyright © NTT Communications Corporation. All right reserved. 動く書き方 var proc = ctx. ( , 1, 1); proc. = (ev) { } $(“#hoge”).on(“click”, function(ev) { var src = ctx. (stream); src. (proc); proc. (ctx.destination); }); 12 • ScriptProcessorのバッファ値を2048以上 • onaudioprocessは事前に設定しておく • connect(ctx.destination)は、ユーザーア クションと連動させる コールする タイミング が重要にゃ
  13. 13. Copyright © NTT Communications Corporation. All right reserved. 今日の名言 13 バグは 仕様!! 確信犯

×