WebRTCについて

9,923 views

Published on

WebRTCについて

Published in: Technology
0 Comments
11 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
9,923
On SlideShare
0
From Embeds
0
Number of Embeds
198
Actions
Shares
0
Downloads
0
Comments
0
Likes
11
Embeds 0
No embeds

No notes for slide

WebRTCについて

  1. 1. 第3回勉強会 竹林真
  2. 2. 今回は
  3. 3. WebRTC について話そうと思います
  4. 4. その前に
  5. 5. 先日、つい買ってしまいました
  6. 6. ※こんなことはしません。
  7. 7. では本題のWebRTCについて
  8. 8. WebRTCとは
  9. 9. WebRTCWebRTC(Real-Time Communications)とは、リアルタイムコミュニケーションをシンプルなJavascriptAPIを通してウェブブラウザ上で利用できるフリーでオープンなプロジェクトのこと
  10. 10. まだw3cで仕様策定中策定が2013年2月予定
  11. 11. WebRTCでできること(仮)・ブラウザからwebカメラへアクセス・ブラウザからマイクへアクセス・リアルタイム通信技術(マルチメディアに特化)
  12. 12. Javascriptのみで動作するのでNo Flash が実現できる かもしれません
  13. 13. アーキテクチャ
  14. 14. データ転送・XMPP / JINGLE の技術 (Google Talkなどで利用)・STUN(Simple Traversal of UDP through NATs)・セッション管理機能・ピアツーピア通信もできる
  15. 15. 類似技術WebSocketクライアント、サーバ間の双方向通信の技術ハンドシェイクを使った通信をする仕様
  16. 16. 音声エンジン・iSAC / iLBC コーデック・いろいろなVoIPツールで利用されている技術・NetEQ for Voice、Acoustic Echo Canceler (AEC)、NoiseReduction (NR)
  17. 17. http://jp.techcrunch.com/archives/20100518google-to-buy-global-ip-solutions-for-68-2-million-in-cash/
  18. 18. 動画エンジン・WebMでも利用されているVP8コーデック・Video Jitter Buffer、Image enhancements
  19. 19. http://jp.techcrunch.com/archives/20090805google-acquires-video-compression-technology-company-on2-for-106-million/
  20. 20. Google様は強いですね
  21. 21. WebAPIgetUserMedia    カメラ・マイクでバイスを取得するAPIpeerConnection  P2P接続をするためのAPI  
  22. 22. 現在利用できる環境Opera / Lab versionGoogle Chrome / dev-channel 2012.1.18 new!!
  23. 23. wktkする技術が盛りだくさん
  24. 24. デモ
  25. 25. デモ1 通信
  26. 26. デモ2 カメラ
  27. 27. サンプルコード<html> <head> </head> <body> <h2>CameraDemo</h2> <video id="live" autoplay controls></video> <script type="text/javascript"> video = document.getElementById("live") //for GoogleChrome navigator.webkitGetUserMedia("video audio", //Operaの場合はnavigator.getUserMedia function(stream) { video.src = window.webkitURL.createObjectURL(stream); }, function(err) { console.log("Unable to get video stream!") } ) </script> </body></html>
  28. 28. まとめこれらの新技術なのでまだ未完成だが、いずれ実用的になればブラウザだけでいろいろなことができるようになるだろう
  29. 29. その他最近触った技術stream-m HTML5を使った動画配信ツールサーバ側で動画をエンコードして配信するプロダクトhttp://code.google.com/p/stream-m/
  30. 30. 次に触ってみたいものElectroserver Flashと接続するサーバ 大規模オンラインゲームに向いているらしいCasandra,HBase 分散データベース新しいJavascriptAPI系
  31. 31. 参考資料WebRTChttp://www.webrtc.org/Web RTC Getting startedhttp://www.webrtc.org/reference/getting-startedHands on: building an HTML5 photo booth with Chromes new webcam APIhttp://arstechnica.com/business/news/2012/01/hands-on-building-an-html5-photo-booth-with-chromes-new-webcam-api.arsWeb Real-Time Communications Working Group Charterhttp://www.w3.org/2011/04/webrtc-charter.htmlA Web RTC Tutorial | Ericsson Labshttps://labs.ericsson.com/developer-community/blog/web-rtc-tutorial
  32. 32. ご清聴ありがとうございました

×