Get started with simple-peer CDN

MIT licensed

Simple-Peer is a library for creating peer-to-peer connections for real-time applications.

Tags:
  • webrtc
  • p2p
  • data channel
  • data channels
  • data
  • video
  • voice
  • peer
  • stream
  • peer-to-peer
  • data channel stream
  • webrtc stream

Stable version

Copied!

How to start using simple-peer CDN


<!DOCTYPE html>
<html>
<head>
    <title>Get started with simple-peer CDN - cdnhub.io</title>
    <script src="https://cdn.cdnhub.io/simple-peer/9.11.1/simplepeer.min.js"></script>
</head>
<body>
    <button id="start">Start Call</button>
    <div id="log"></div>

    <script>
      const log = document.getElementById('log');
      const startButton = document.getElementById('start');
      let localStream;
      let peer;

      navigator.mediaDevices.getUserMedia({ audio: true, video: true })
        .then(stream => {
          localStream = stream;
          const pcConfig = { iceServers: [{ urls: 'stun:stun.l.google.com:19302' }] };
          peer = new SimplePeer({ initiator: false, trickle: false, stream: localStream, config: pcConfig });

          peer.on('signal', data => {
            log.textContent += `\nSDP: ${JSON.stringify(data.sdp)}`;
            peer.sendSignal(data);
          });

          peer.on('stream', remoteStream => {
            log.textContent += `\nRemote stream: ${remoteStream.toString()}`;
          });

          peer.on('connectionstatechange', () => {
            log.textContent += `\nConnection state: ${peer.connectionState}`;
          });

          startButton.addEventListener('click', () => {
            peer.createOffer()
              .then(offer => {
                return peer.setLocalDescription(offer);
              })
              .then(() => {
                log.textContent += `\nLocal description: ${JSON.stringify(peer.localDescription)}`;
                peer.sendSignal(peer.localDescription);
              })
              .catch(err => {
                log.textContent += `\nError: ${err.toString()}`;
              });
          });
        })
        .catch(err => {
          log.textContent += `\nError: ${err.toString()}`;
        });
    </script>
</body>
</html>
Copied!

All versions