Getting Started with WebRTC: If you have basic HTML and JavaScript, you're well on the way to adding real time, peer-to-peer communication to your web applications using WebRTC. This book shows you how through a totally practical, structured course.

When the World Wide Web (WWW) was first created in the early 1990's, it was built upon a page-centric model that used HREF-based hyperlinks. In this early model of the web, browsers navigated from one page to another in order to present new content and to update their HTML-based user interfaces.

Around the year 2000, a new approach to web browsing had started to develop, and by the middle of that decade, it had become standardized as the XMLHttpRequest (XHR) API. This new XHR API enabled web developers to create web applications that didn't need to navigate to a new page to update their content or user interface. It allowed them to utilize server-based web services that provided access to structured data and snippets of pages or other content. This led to a whole new approach to the web, which is now commonly referred to as Web 2.0. The introduction of this new XHR API enabled services such as Gmail, Facebook, Twitter, and more to create a much more dynamic and social web for us.

Now the web is undergoing yet another transformation that enables individual web browsers to stream data directly to each other without the need for sending it via intermediary servers. This new form of peer-to-peer communication is built upon a new set of APIs that is being standardized by the Web Real-Time Communications Working Group available at http://www.w3.org/2011/04/webrtc/ of the World Wide Web Consortium (W3C), and a set of protocols standardized by Real-Time Communication in WEB-browsers Working Group available at http://tools.ietf.org/wg/rtcweb/ of the Internet Engineering Task Force (IETF).

Just as the introduction of the XHR API led to the Web 2.0 revolution, the introduction of the new WebRTC standards is creating a new revolution too.

It's time to say hello to the real-time web!

The real-time web allows you to set up dynamic connections to other web browsers and web-enabled devices quickly and easily. This opens the door to a whole new range of peer-to-peer communication, including text-based chat, file sharing, screen sharing, gaming, sensor data feeds, audio calls, video chat, and more. You can now see that the implications of WebRTC are very broad. Direct and secure peer-to-peer communication between browsers will have a big impact on the modern web, reshaping the way we use the physical networks that make up the Internet.

Direct peer-to-peer connections often provide lower latency, making gaming, video streaming, sensor data feeds, and so on, appear faster and more interactive or real-time, hence the use of this term.

Secure peer-to-peer connections allow you to exchange information privately without it being logged or managed by intermediary servers. This reduces the need for some large service providers while creating opportunities for people to create new types of services and applications. It introduces improved privacy for some individuals while it may also create new complexities for regulators and law enforcement organizations.

And the efficient peer-to-peer exchange of binary data streams removes the need to serialize, re-encode, or convert this data at each step in the process. This leads to a much more efficient use of network and application resources, as well as creating a less error prone and more robust data exchange pipeline.

This is just a brief overview of how you can use WebRTC, and by the end of this book, you will have all the information you need to start turning your own new ideas into practical applications.

The goal of this book is to get you started with WebRTC, so let's do that right now. You can easily find out if your browser supports the camera access functionality by visiting one of the existing demo sites such as http://www.simpl.info/getusermedia, and if it does, you should be prompted to provide permission to share your camera. Once you provide this permission, you should see a web page with a live video stream from your PC or mobile devices' video camera, and be experiencing the interesting sensation of looking at a video of yourself staring right back at you. That's how simple it is to start using WebRTC.

Now, perhaps you'd like to try using it to communicate with another person. You can do this by visiting another demo site such as http://apprtc.appspot.com, which will create a unique URL for your video chat. Just send this URL to another person with a browser that also supports WebRTC, and once they open that page, you should see two video elements displayed on the page: one from your local video camera and one from the other person's video camera. There's a lot of complex negotiation that's gone on in the background, but assuming your browser supports WebRTC and your network doesn't actively prevent it, then you should now have a clear idea of just how easy it is to use.

But what web browsers support WebRTC? Let's find out.

The WebRTC standards landscape is home to one of the fastest evolving communities on the web. One of the biggest challenges this creates is that of compatibility and interoperability. Here is an overview of what this is up to today and how to stay up-to-date as this continues to evolve.

Chrome and Firefox on Android

WebRTC is also available for Chrome and Firefox on the Android platform; however, currently you must manually configure certain settings to enable this functionality.

Here are the key steps you need to enable this for Chrome. These are from the Chrome for Android release notes posted on the discuss-webrtc forum available at https://groups.google.com/forum/#!topic/discuss-webrtc/uFOMhd-AG0A:

To enable WebRTC on Chrome for Android:

1. Type in chrome://flags/ in the omnibox to access the flags.

2. Scroll about a third down and enable the Enable WebRTC flag.

3. You will be asked to relaunch the browser at the bottom of the page in order for the flag to take effect.

   

   Enabling WebRTC using Chrome flags on Android

Here are the key steps you need to enable WebRTC for Firefox. These are from a post on the Mozilla Hacks blog about the new Firefox for Android release available at https://hacks.mozilla.org/2013/04/webrtc-update-our-first-implementation-will-be-in-release-soon-welcome-to-the-party-but-please-watch-your-head/:

You can enable it by setting both the media.navigator.enabled pref and the media.peerconnection.enabled pref to "true" (browse to about:config and search for media.navigator.enabled and media.peerconnection.enabled in the list of prefs).

Enabling WebRTC using Firefox settings on Android

You should now have a clear overview of what the term WebRTC means and for what it can be used. You should be able to identify which browsers support WebRTC and have all the resources you need to find the latest up-to-date information on how this is evolving. You should also have been able to try the different aspects of WebRTC for yourself quickly and easily using your own browser if you so choose.

Next, we will take a more technical look at how the different WebRTC API components all fit together.

Then, we will start by fleshing out the simple peer-to-peer video call scenario into a fully working application.

Later, we will explore how this can be simplified down to just an audio only call or extended with text-based chat and file sharing.

And then, we will explore two real-world application scenarios based upon e-learning and team communication.