PeerJS provides a complete, configurable, and easy-to-use peer-to-peer API built on top of WebRTC, supporting both data channels and media streams.
Include the library
from the cdn:
<script src="https://cdnjs.cloudflare.com/ajax/libs/peerjs/0.3.14/peer.js"></script>
with modules:
npm install peerjs
or yarn add peerjs
and the usage:
import Peer from 'peerjs';
Create a Peer
Get a free API key. Your id only needs to be unique to the namespace of your API key.
var peer = new Peer('pick-an-id', {key: 'myapikey'});
// You can pick your own id or omit the id if you want to get a random one from the server.
Connect
var conn = peer.connect('another-peers-id');
conn.on('open', function(){
conn.send('hi!');
});
Receive
peer.on('connection', function(conn) {
conn.on('data', function(data){
// Will print 'hi!'
console.log(data);
});
});
Call
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
navigator.getUserMedia({video: true, audio: true}, function(stream) {
var call = peer.call('another-peers-id', stream);
call.on('stream', function(remoteStream) {
// Show stream in some <video> element.
});
}, function(err) {
console.log('Failed to get local stream' ,err);
});
Answer
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
peer.on('call', function(call) {
navigator.getUserMedia({video: true, audio: true}, function(stream) {
call.answer(stream); // Answer the call with an A/V stream.
call.on('stream', function(remoteStream) {
// Show stream in some <video> element.
});
}, function(err) {
console.log('Failed to get local stream' ,err);
});
});
Thank you to all our backers! [Become a backer]
PeerJS is licensed under the MIT License.