Real-time communication for the web

With WebRTC, you can add real-time communication capabilities to your application that works on top of an open standard. It supports video, voice, and generic data to be sent between peers, allowing developers to build powerful voice- and video-communication solutions. The technology is available on all modern browsers as well as on native clients for all major platforms. The technologies behind WebRTC are implemented as an open web standard and available as regular JavaScript APIs in all major browsers. For native clients, like Android and iOS applications, a library is available that provides the same functionality. The WebRTC project is open-source and supported by Apple, Google, Microsoft and Mozilla, amongst others. This page is maintained by the Google WebRTC team.

This is a collection of small samples demonstrating various parts of the WebRTC APIs. The code for all samples are available in the GitHub repository.

Most of the samples use adapter.js, a shim to insulate apps from spec changes and prefix differences.
https://webrtc.org/getting-started/testing lists command line flags useful for development and testing with Chrome.
Patches and issues welcome! See CONTRIBUTING.md for instructions.

Warning: It is highly recommended to use headphones when testing these samples, as it will otherwise risk loud audio feedback on your system.

getUserMedia():

Access media devices

• Basic getUserMedia demo

• Use getUserMedia with canvas

• Use getUserMedia with canvas and CSS filters

• Choose camera resolution

• Audio-only getUserMedia() output to local audio element

• Audio-only getUserMedia() displaying volume

• Record stream

• Screensharing with getDisplayMedia

• Control camera pan, tilt, and zoom
• 
  

Devices:

Query media devices

• Choose camera, microphone and speaker
• Choose media source and audio output
• 
  

Stream capture:

Stream from canvas or video elements

• Stream from a video element to a video element

• Stream from a video element to a peer connection

• Stream from a canvas element to a video element

• Stream from a canvas element to a peer connection

• Record a stream from a canvas element

• Guiding video encoding with content hints
• 
  

RTCPeerConnection:

Controlling peer connectivity

• Basic peer connection demo

• Peer connection using Perfect Negotiation

• Audio-only peer connection demo

• Change bandwidth on the fly

• Change codecs before the call

• Upgrade a call and turn video on

• Multiple peer connections at once

• Forward the output of one PC into another

• Munge SDP parameters

• Use pranswer when setting up a peer connection

• Constraints and stats

• More constraints and stats

• RTCPeerConnection and requestVideoFrameCallback()

• Display createOffer output for various scenarios

• Use RTCDTMFSender

• Display peer connection states

• ICE candidate gathering from STUN/TURN servers

• Do an ICE restart

• Web Audio output as input to peer connection

• Peer connection as input to Web Audio

• Measure how long renegotiation takes
• 
  

RTCDataChannel:

Send arbitrary data over peer connections

• Transmit text

• Transfer a file

• Transfer data

• Messaging

• 
  

Video chat:

Full featured WebRTC application

• AppRTC video chat client powered by Google App Engine

• AppRTC URL parameters
• 
  

Insertable Streams:

API for processing media

• End to end encryption using WebRTC Insertable Streams

(Experimental)

• Video analyzer using WebRTC Insertable Streams

(Experimental)

• Video processing using MediaStream Insertable Streams

(Experimental)

• Audio processing using MediaStream Insertable Streams

(Experimental)

Application flow

A WebRTC application will usually go through a common application flow. Accessing the media devices, opening peer connections, discovering peers, and start streaming. We recommend that new developers read through our introduction to WebRTC before they start developing.

Getting started with WebRTC

WebRTC APIs

The WebRTC standard covers, on a high level, two different technologies: media capture devices and peer-to-peer connectivity.

Media capture devices includes video cameras and microphones, but also screen capturing “devices”. For cameras and microphones, we use navigator.mediaDevices.getUserMedia() to capture MediaStreams. For screen recording, we use navigator.mediaDevices.getDisplayMedia() instead.

The peer-to-peer connectivity is handled by the RTCPeerConnection interface. This is the central point for establishing and controlling the connection between two peers in WebRTC.