Book Image

WebRTC Blueprints

By : Andrii Sergiienko
Book Image

WebRTC Blueprints

By: Andrii Sergiienko

Overview of this book

Table of Contents (13 chapters)
WebRTC Blueprints
About the Author
About the Reviewers


What made me start writing this book is the enthusiasm regarding WebRTC, an open project for browser-based, real-time communication.

Until now, building a good interactive web service was always a big problem. You had to use different solutions for different web browsers, you had to use third-party software components and install them on a client's PC, you had problems with cross-platform support, and so many other problems.

Now we have WebRTC. Its development is still in progress and not all browsers and platforms fully support it yet, but it works great already. With WebRTC, you can easily build a rich, media-interactive website or service, and most of your potential users will be able to use it today without any additional specific efforts.

This great project enables easy development of rich media web services without the need to download/install any additional software components on a server or on a client's PC.

I use WebRTC daily at my job for real-life projects, and I will share my knowledge and recipes in this book.

What is WebRTC?

Web Real-Time Communication (WebRTC) is a new (still under development) open framework for the Web to enable browser-to-browser applications for audio/video calling, video chats, and peer-to-peer file sharing without any additional third-party software/plugins.

It was open sourced by Google in 2011 and includes the fundamental building components for high-quality communication on the Web. These components, when implemented in a browser, can be accessed through a JavaScript API, enabling developers to build their own rich media web applications. Google, Mozilla, and Opera support WebRTC and are involved in the development process.

The following are the major components of the WebRTC API:

  • getUserMedia: This component allows a web browser to access the camera and microphone

  • PeerConnection: This component sets up audio/video calls

  • DataChannels: This component allows browsers to share data through peer-to-peer connections

The WebRTC technology contains a complete stack for voice communications, which includes all the necessary codecs. In addition, it provides software-based AEC (acoustic echo cancellation), AGC (automatic gain control), and noise reduction/suppression.

WebRTC also provides the following modern and powerful possibilities to utilize video communications:

  • The VP8 codec

  • Conceal packet loss

  • Clean up noisy images

  • Capture and playback capabilities

Peer-to-peer connections can be established using the built-in key NAT/firewall traversal technology using ICE/STUN/TURN and support proxies. So, you don't need to use any special third-party technologies to build a peer-to-peer communication between the customers located behind a firewall or NAT.

To help mitigate the effects of packet loss and unreliable networks, WebRTC supports dynamic jitter buffers and error concealment techniques for audio or video communications.

Supported platforms and devices

WebRTC is a very new technology and is still being developed. Thus, right now, there are still platforms and web browsers that don't support it at all yet or support partially.

WebRTC is supported in the following desktop browsers:

  • Google Chrome Version 23 and higher

  • Mozilla Firefox Version 22 and higher

  • Opera Version 18 and higher

  • Internet Explorer doesn't support WebRTC yet, but this can be solved using the Chrome Component for IE

At the time of writing this book, the web browser WebRTC API is natively supported only in the Android platform.

  • Google Chrome Version 29 and higher

  • Mozilla Firefox Version 24 and higher

  • Opera Mobile Version 12 and higher

  • Google Chrome OS

Codecs that are supported in WebRTC

For audio calls, the supported codecs are Opus, G.711, G.722, iLBC, and iSAC.

For video communication, VP8 is the only supported codec at the moment.

Considering that WebRTC is still under development, the list of supported codecs may change in the future.

Why should I use WebRTC?

Currently, there are no easy-to-use, high quality, and complete solutions available that would enable communication using just a web browser. Until today, if you wanted to build a rich media cross-platform web application, you had to use Flash, Java Applets, and a bunch of third-party plugins to make it work. Such solutions usually are heavyweight and difficult to implement and support.

This leads to a situation where we have Internet access in almost every apartment across the world, but we still don't have a simple and effective solution for audio/video rich media applications.

WebRTC is a technology that is intended to solve this situation. It is already integrated with the best voice and video engines that have been deployed on millions of end points over recent years.

With this technology, you can use a universal API and a set of built-in technologies and components to build your applications, and you don't need to keep in mind a bunch of platforms and operating systems you would like your application to support.

Applications you can easily build using WebRTC

The following are the applications you can easily build using WebRTC:

  • Peer-to-peer audio/video conferences

  • Pre-recorded video streaming

  • Desktop screen casting

  • Peer-to-peer file sharing and transferring

More ideas

  • An interactive language school

  • Webinars

  • A job interview service

  • A distributed radio broadcasting service

  • A distance learning school

  • An interactive dating service

Again, you don't need to use any additional software or libraries. You have to use just the WebRTC API supported by most web browsers today. It works great for Windows, Linux, or Mac OS X without special efforts from the developer.

I believe that after reading this book, you'll want to build your next interactive media web application using WebRTC.

Benefits of using WebRTC in your business

The following are the benefits of using WebRTC in your business:

  • Reducing costs: WebRTC is a free and open source technology. You don't need to pay for complex proprietary solutions. IT deployment and support costs can be lowered because now you don't need to deploy special client software for your customers.

  • Plugins: You don't need plugins at all. Previously, you had to use Flash, Java Applets, and other tricky solutions to build interactive rich media web applications. Customers had to download and install third-party plugins to be able to use your media content. You also had to keep in mind different solutions/plugins for a variety of operating systems and platforms. Now you no longer need to care about this.

  • Peer-to-peer communication: In most cases, communication will be established directly between your customers and you don't need to have a middle point of contact.

  • Easy to use: You don't need to be a professional programmer or have a team of certified developers with some kind of specific knowledge. In a basic case, you can easily integrate the WebRTC functionality into your web services/sites by using the JavaScript API or even by using a ready-to-go framework.

  • A single solution for all platforms: You don't need to develop a special native version of your web service for different platforms (iOS, Android, Windows, and others). WebRTC is developed to be a cross-platform and universal tool.

  • WebRTC is open source and free: A community can discover new bugs and solve them effectively and quickly. Moreover, it is developed and standardized by the world software companies such as Mozilla, Google, and Opera.

What this book covers

Chapter 1, Developing a WebRTC Application, covers the basics of the technology and building a completed audio/video conference real-life web application. We will also learn about SDP (Session Description Protocol), signaling, client-server sides' interoperation, and configuring the STUN and TURN servers.

Chapter 2, Using the WebRTC Data API, explains how to build a peer-to-peer, cross-platform file sharing web service using the WebRTC Data API.

Chapter 3, The Media Streaming and Screen Casting Services, introduces you to streaming prerecorded, peer-to-peer media content and desktop sharing. In this chapter, you will build a simple application that provides such functionality.

Chapter 4, Security and Authentication, covers security questions and why you shouldn't forget them while developing your applications. So, in this chapter, you will learn how to make your WebRTC solutions secure, why authentication may be very important, and how you can implement this functionality in your products.

Chapter 5, Mobile Platforms, covers how to make your interactive application work great on mobile devices. You will learn about the aspects that will help you develop great WebRTC products keeping mobile devices in mind.

What you need for this book

You don't need any special software to read this book and to make applications. We will use JavaScript for the client side, so you will need a web browser (Chrome is preferable). We will use Erlang for server-side code, so you need an OS compatible with Erlang; for example, you can use MS Windows, but any Linux distribution or Mac OS X would be preferable.

Who this book is for

This book will introduce you to creating interactive media web applications and services using WebRTC. In this book, we will create several web-based applications using WebRTC, including ones for the client side and the server side.

Client-side code will be presented in JavaScript. This is an optimal and simple way to utilize a browser WebRTC API.

Server-side code for applications in the book is written in Erlang. Why Erlang? It is a small language, good for quick prototyping and writing production code in an elegant and powerful way.

Thus, you don't have to be a professional software developer, but you are expected to have programming knowledge in Java, JavaScript, Ruby, Python or other mainstream languages, or at least have typical web development skills.


In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.

Code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles are shown as follows: "We can declare our module through the use of the module directive."

A block of code is set as follows:

{ok, Port} = application:get_env(port),
{ok, Timeout} = application:get_env(timeout),
{ok, Workers} = application:get_env(workers),

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

{ok, Port} = application:get_env(port),
{ok, Timeout} = application:get_env(timeout),
{ok, Workers} = application:get_env(workers),

Any command-line input or output is written as follows:

# ln –s /usr/local/www/index.html /usr/local/www/default.html

New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: "Now, you can right-click on the link and select the Download to... option."


Warnings or important notes appear in a box like this.


Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.

To send us general feedback, simply send an e-mail to , and mention the book title via the subject of your message.

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.

Downloading the example code

You can download the example code files for all Packt books you have purchased from your account at If you purchased this book elsewhere, you can visit and register to have the files e-mailed directly to you.


Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you would report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting, selecting your book, clicking on the errata submission form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded on our website, or added to any list of existing errata, under the Errata section of that title. Any existing errata can be viewed by selecting your title from


Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works, in any form, on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.

Please contact us at with a link to the suspected pirated material.

We appreciate your help in protecting our authors, and our ability to bring you valuable content.


You can contact us at if you are having a problem with any aspect of the book, and we will do our best to address it.