WebRTCPeerJS


Created by Keiji Yoshida / @_yosssi  




 Keiji Yoshida

Web

Node.js, JavaScript, HTML5, WebRTC, HTTP/2.0
 




WebRTC

PeerJSWeb
 

WebRTC




Web Real-Time Communications

Web
 



W3CAPIIETF
 

WebRTCAPI




getUserMedia
Web

RTCPeerConnection


RTCDataChannel

 

WebRTC







Web
 

1/3




PCAndroidGoogle ChromeFirefox


Google Chrome 232012/11/06

Firefox 222013/06/25

Google Chrome for Android 282013/07/11

Firefox for Android 242013/09/17
 


2/3




AppleMicrosoftWebRTC


"Apple (NASDAQ: AAPL) has ignored WebRTC development, while Microsoft (NASDAQ: MSFT) has actively developed a competing technology known as CU-RTC."
Microsoft, Apple undercut mobile WebRTC development - FierceMobileIT
 


3/3




WebRTCAPIvendor prefixes
W3C標準 Google Chrome Firefox
getUserMedia webkitGetUserMedia mozGetUserMedia
RTCPeerConnection webkitRTCPeerConnection mozRTCPeerConnection
RTCSessionDescription RTCSessionDescription mozRTCSessionDescription
RTCIceCandidate RTCIceCandidate mozRTCIceCandidate

W3Cadapter.js
https://code.google.com/p/webrtc/source/browse/trunk/
samples/js/base/adapter.js
 

WebRTCP2P



WebRTCP2P




PeerJShttp://peerjs.com

simpleWebRTChttps://github.com/HenrikJoreteg/SimpleWebRTC

webRTC.iohttps://github.com/webRTC/webRTC.io
 

PeerJShttp://peerjs.com






RTCPeerConnectionRTCDataChannel
 

 

// Peerオブジェクトの生成(シグナリングサーバのホスト名とポート番号を指定する)
var peer = new Peer({host: 'localhost', port: 9000});

// シグナリングサーバとの接続確立時にopenイベントが発生
peer.on('open', function(id){
  getUserMedia({video: true, audio: true}, function(stream) {
    var call = peer.call('another-peers-id', stream);
    call.on('stream', function(remoteStream) {
      // 受け取ったストリームをvideoタグなどへ出力する処理を記載
    });
  }, function(error) {
    // ローカルストリーム取得失敗時の処理を記載
  });
});
          

 

// Peerオブジェクトの生成(シグナリングサーバのホスト名とポート番号を指定する)
var peer = new Peer({host: 'localhost', port: 9000});

// 他のWebブラウザからの受信時にcallイベントが発生
peer.on('call', function(call){
  getUserMedia({video: true, audio: true}, function(stream) {
    call.answer(stream);
    call.on('stream', function(remoteStream) {
      // 受け取ったストリームをvideoタグなどへ出力する処理を記載
    });
  }, function(error) {
    // ローカルストリーム取得失敗時の処理を記載
  });
});
          

 

$> npm install peer
$> peerjs --port 9000 --key peerjs
          




Vois.io Sessionshttps://vois.io/ja/sessions

Web






WebRTC, PeerJS
 


PeerJS使




WebSocket