Skip to content

yodlr/simple-peer

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

simple-peer travis npm npm downloads gittip

Simple WebRTC video/voice and data channels.

Sauce Test Status

features

  • concise, node.js-style API for WebRTC
  • supports video/voice streams
  • supports data channel
  • supports advanced options like:

This module works great in the browser with browserify.

Note: If you're NOT using browserify, then use the included standalone file simplepeer.min.js. This exports a SimplePeer function on window.

install

npm install simple-peer

usage

These examples create two peers in the same page.

In a real-world application, the sender and receiver Peer instances would exist in separate browsers. A "signaling server" (usually implemented with websockets) would be used to exchange signaling data between the two browsers until a peer-to-peer connection is established.

data channels

var SimplePeer = require('simple-peer')

var peer1 = new SimplePeer({ initiator: true })
var peer2 = new SimplePeer()

peer1.on('signal', function (data) {
  // when peer1 has signaling data, give it to peer2
  peer2.signal(data)
})

peer2.on('signal', function (data) {
  // same as above, but in reverse
  peer1.signal(data)
})

peer1.on('connect', function () {
  // wait for 'connect' event before using the data channel
  peer1.send('hey peer2, how is it going?')
})

peer2.on('data', function (data) {
  // got a data channel message
  console.log('got a message from peer1: ' + data)
})

video/voice

Video/voice is also super simple! In this example, peer1 sends video to peer2.

var SimplePeer = require('simple-peer')

// get video/voice stream
navigator.getUserMedia({ video: true, audio: true }, gotMedia, function () {})

function gotMedia (stream) {
  var peer1 = new SimplePeer({ initiator: true, stream: stream })
  var peer2 = new SimplePeer()

  peer1.on('signal', function (data) {
    peer2.signal(data)
  })

  peer2.on('signal', function (data) {
    peer1.signal(data)
  })

  peer2.on('stream', function (stream) {
    // got remote video stream, now let's show it in a video tag
    var video = document.querySelector('video')
    video.src = window.URL.createObjectURL(stream)
    video.play()
  })
}

For two-way video, simply pass a stream option into both Peer constructors. Simple!

real-world apps that use simple-peer

  • Instant - Secure, anonymous, streaming file transfer
  • WebTorrent - Streaming torrent client in the browser
  • PusherTC - Video chat with using Pusher. See guide.
  • lxjs-chat - Omegle-like video chat site
  • Your app here! - send a PR!

api

peer = new SimplePeer([opts])

Create a new WebRTC peer connection.

A "data channel" for text/binary communication is always established, because it's cheap and often useful. For video/voice communication, pass the stream option.

If opts is specified, then the default options (shown below) will be overridden.

{
  initiator: false,
  stream: false,
  config: { iceServers: [ { url: 'stun:23.21.150.121' } ] },
  constraints: {},
  channelName: '<random string>',
  trickle: true
}

The options do the following:

  • initiator - set to true if this is the initiating peer
  • stream - if video/voice is desired, pass stream returned from getUserMedia
  • config - custom webrtc configuration
  • constraints - custom webrtc video/voice constaints
  • channelName - custom webrtc data channel name
  • trickle - set to false to disable trickle ICE and get a single 'signal' event (slower)

peer.signal(data)

Call this method whenever the remote peer emits a peer.on('signal') event.

The data will be a String that encapsulates a webrtc offer, answer, or ice candidate. These messages help the peers to eventually establish a direct connection to each other. The contents of these strings are an implementation detail that can be ignored by the user of this module; simply pass the data from 'signal' events to the remote peer, call peer.signal(data), and everything will just work.

peer.send(data)

Send text/binary data to the remote peer. data can be any of several types: String, Buffer (see buffer), TypedArrayView (Uint8Array, etc.), ArrayBuffer, or Blob (in browsers that support it).

Other data types will be transformed with JSON.stringify before sending. This is handy for sending object literals across like this: peer.send({ type: 'data', data: 'hi' }).

Note: If this method is called before the peer.on('connect') event has fired, then data will be buffered.

peer.destroy([onclose])

Destroy and cleanup this peer connection.

If the optional onclose parameter is passed, then it will be registered as a listener on the 'close' event.

duplex stream

Peer objects are instances of stream.Duplex. The behave very similarly to a net.Socket from the node core net module. The duplex stream reads/writes to the data channel.

var peer = new Peer(opts)
// ... signaling ...
peer.write(new Buffer('hey'))
peer.on('data', function (chunk) {
  console.log('got a chunk', chunk)
})

events

peer.on('signal', function (data) {})

Fired when the peer wants to send signaling data to the remote peer.

It is the responsibility of the application developer (that's you!) to get this data to the other peer. This usually entails using a websocket signaling server. Then, simply call peer.signal(data) on the remote peer.

peer.on('connect', function () {})

Fired when the peer connection and data channel are ready to use.

peer.on('data', function (data) {})

Received a message from the remote peer (via the data channel).

data will be either a String or a Buffer/Uint8Array (see buffer).

peer.on('stream', function (stream) {})

Received a remote video stream, which can be displayed in a video tag:

peer.on('stream', function (stream) {
  var video = document.createElement('video')
  video.src = window.URL.createObjectURL(stream)
  document.body.appendChild(video)
  video.play()
})

peer.on('close', function () {})

Called when the peer connection has closed.

peer.on('error', function (err) {})

Fired when a fatal error occurs. Usually, this means bad signaling data was received from the remote peer.

err is an Error object.

connecting more than 2 peers?

The simplest way to do that is to create a full-mesh topology. That means that every peer opens a connection to every other peer. To illustrate:

full mesh topology

To broadcast a message, just iterate over all the peers and call peer.send.

So, say you have 3 peers. Then, when a peer wants to send some data it must send it 2 times, once to each of the other peers. So you're going to want to be a bit careful about the size of the data you send.

Full mesh topologies don't scale well when the number of peers is very large. The total number of edges in the network will be full mesh formula where n is the number of peers.

For clarity, here is the code to connect 3 peers together:

Peer 1

// These are peer1's connections to peer2 and peer3
var peer2 = new SimplePeer({ initiator: true })
var peer3 = new SimplePeer({ initiator: true })

peer2.on('signal', function (data) {
  // send this signaling data to peer2 somehow
})

peer2.on('connect', function () {
  peer2.send('hi peer2, this is peer1')
})

peer2.on('data', function (data) {
  console.log('got a message from peer2: ' + data)
})

peer3.on('signal', function (data) {
  // send this signaling data to peer3 somehow
})

peer3.on('connect', function () {
  peer3.send('hi peer3, this is peer1')
})

peer3.on('data', function (data) {
  console.log('got a message from peer3: ' + data)
})

Peer 2

// These are peer2's connections to peer1 and peer3
var peer1 = new SimplePeer()
var peer3 = new SimplePeer({ initiator: true })

peer1.on('signal', function (data) {
  // send this signaling data to peer1 somehow
})

peer1.on('connect', function () {
  peer1.send('hi peer1, this is peer2')
})

peer1.on('data', function (data) {
  console.log('got a message from peer1: ' + data)
})

peer3.on('signal', function (data) {
  // send this signaling data to peer3 somehow
})

peer3.on('connect', function () {
  peer3.send('hi peer3, this is peer2')
})

peer3.on('data', function (data) {
  console.log('got a message from peer3: ' + data)
})

Peer 3

// These are peer3's connections to peer1 and peer2
var peer1 = new SimplePeer()
var peer2 = new SimplePeer()

peer1.on('signal', function (data) {
  // send this signaling data to peer1 somehow
})

peer1.on('connect', function () {
  peer1.send('hi peer1, this is peer3')
})

peer1.on('data', function (data) {
  console.log('got a message from peer1: ' + data)
})

peer2.on('signal', function (data) {
  // send this signaling data to peer2 somehow
})

peer2.on('connect', function () {
  peer2.send('hi peer2, this is peer3')
})

peer2.on('data', function (data) {
  console.log('got a message from peer2: ' + data)
})

js-standard-style

license

MIT. Copyright (c) Feross Aboukhadijeh.

About

Simple WebRTC video/voice and data channels

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%