Real-Time Communication with WebRTC

Chapter 2. Handling Media in the Browser

In this chapter, we start delving into the details of the WebRTC framework, which basically specifies a set of JavaScript APIs for the development of web-based applications. The APIs have been conceived at the outset as friendly tools for the implementation of basic use cases, like a one-to-one audio/video call. They are also meant to be flexible enough to guarantee that the expert developer can implement a variegated set of much more complicated usage scenarios. The programmer is hence provided with a set of APIs which can be roughly divided into three logical groups:

1. Acquisition and management of both local and remote audio and video:

   • MediaStream interface (and related use of the HTML5 <audio> and <video> tags)

2. Management of connections:

   • RTCPeerConnection interface

3. Management of arbitrary data:

   • RTCDataChannel interface.

WebRTC in 10 Steps

The following 10-step recipe describes a typical usage scenario of the WebRTC APIs:

1. Create a MediaStream object from your local devices (e.g., microphone, webcam).
2. Obtain a URL blob from the local MediaStream.
3. Use the obtained URL blob for a local preview.
4. Create an RTCPeerConnection object.
5. Add the local stream to the newly created connection.
6. Send your own session description to the remote peer.
7. Receive the remote session description from your peer.
8. Process the received session description and add the remote stream to your RTCPeerConnection.
9. Obtain a URL blob from the remote stream.
10. Use ...