Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon
Learning WebRTC
Learning WebRTC

Learning WebRTC: Develop interactive real-time communication applications with WebRTC

Arrow left icon
Profile Icon Daniel M. Ristic
Arrow right icon
$19.99 per month
Full star icon Full star icon Full star icon Full star icon Empty star icon 4 (5 Ratings)
Paperback Jun 2015 186 pages 1st Edition
eBook
$17.99 $25.99
Paperback
$32.99
Subscription
Free Trial
Renews at $19.99p/m
Arrow left icon
Profile Icon Daniel M. Ristic
Arrow right icon
$19.99 per month
Full star icon Full star icon Full star icon Full star icon Empty star icon 4 (5 Ratings)
Paperback Jun 2015 186 pages 1st Edition
eBook
$17.99 $25.99
Paperback
$32.99
Subscription
Free Trial
Renews at $19.99p/m
eBook
$17.99 $25.99
Paperback
$32.99
Subscription
Free Trial
Renews at $19.99p/m

What do you get with a Packt Subscription?

Free for first 7 days. $19.99 p/m after that. Cancel any time!
Product feature icon Unlimited ad-free access to the largest independent learning library in tech. Access this title and thousands more!
Product feature icon 50+ new titles added per month, including many first-to-market concepts and exclusive early access to books as they are being written.
Product feature icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Product feature icon Thousands of reference materials covering every tech concept you need to stay up to date.
Subscribe now
View plans & pricing
Table of content icon View table of contents Preview book icon Preview Book

Learning WebRTC

Chapter 1. Getting Started with WebRTC

The Internet is no stranger to audio and video. Everyday web applications, such as Netflix and Pandora, stream audio and video content to millions of people. On the other hand, the Web is a stranger to real-time communication. Websites, such as Facebook, are only just starting to enable video-based communication in a browser, and they typically use a plugin that users have to install. This is where Web Real-Time Communication (WebRTC) comes into play.

In this chapter, we are going to cover the basics of WebRTC:

  • The current status of the audio and video space
  • The role that WebRTC plays in changing this space
  • The major features of WebRTC and how they can be used

Audio and video communication today

Communicating with audio and video is a fairly common task with a history of technologies and tools. For a good example of audio communication, just take a look at a cell phone carrier. Large phone companies have established large networks of audio communication technology to bring audio communication to millions of people across the globe. These networks are a great example when it comes to showing widespread audio communication at its finest.

Video communication is also becoming just as prevalent as audio communication. With technologies such as Apple's FaceTime, Google Hangouts, and Skype video calling, speaking to someone over a video stream is a simple task for an everyday user. A wide range of techniques have been developed in these applications to ensure that the quality of the video is an excellent experience for the user. There have been engineering solutions to problems, such as losing data packets, recovering from disconnections, and reacting to changes in a user's network.

The aim of WebRTC is to bring all of this technology into the browser. Many of these solutions require users to install plugins or applications on their PCs and mobile devices. They also require developers to pay for licensing, creating a huge barrier and deterring new companies to join this space. With WebRTC, the focus is on enabling this technology for every browser user without the need for plugins or hefty technology license fees for developers. The idea is to be able to simply open up a website and connect with another user right then and there.

Enabling audio and video on the Web

The biggest accomplishment of WebRTC is bringing high-quality audio and video to the open the Web without the need for third-party software or plugins. Currently, there are no high-quality, well-built, freely available solutions that enable real-time communication in the browser. The success of the Internet is largely due to the high availability and open use of technologies, such as HTML, HTTP, and TCP/IP. To move the Internet forward, we want to continue building on top of these technologies. This is where WebRTC comes into play.

To build a real-time communication application from scratch, we would need to bring in a wealth of libraries and frameworks to deal with the many issues faced when developing these types of applications. These typically include software to handle connection dropping, data loss, and NAT traversal. The great thing about WebRTC is that all of this comes built-in to the browser API. Google has open sourced much of the technology involved in accomplishing this communication in a high-quality and complete manner.

Note

Most of the information about WebRTC, including the source code of its implementation, can be found freely available at http://www.webrtc.org/.

With WebRTC, the heavy lifting is all done for you. The API brings a host of technologies into the browser to make implementation details easy. This includes camera and microphone capture, video and audio encoding and decoding, transportation layers, and session management.

Enabling audio and video on the Web

Camera and microphone capture

The first step to using any communication platform is to gain access to the camera and microphone on the device that the user is using. This means detecting the types of devices available, getting permission from the user to access them, and obtaining a stream of data from the device itself. This is where we will begin implementing our first application.

Encoding and decoding audio and video

Unfortunately, even with the improvements made in network speed, sending a stream of audio and video data over the Internet is too much to handle. This is where encoding and decoding comes in. This is the process of breaking down video frames or audio waves into smaller chunks and compressing them into a smaller size. The smaller size then makes it faster to send them across a network and decompress them on the other side. The algorithm behind this technique is typically called a codec.

If you have ever had trouble playing a video file on your computer, then you have some insight into the complex world of video and audio codecs. There are several different ways to encode audio and video streams, each with their different benefits. To add to this, there are many different companies that have different business goals behind creating and maintaining a codec. This means not all of the codecs are free for everyone to use.

There are many codecs in use inside WebRTC. These include H.264, Opus, iSAC, and VP8. When two browsers speak to each other, they pick the most optimal supported codec between the two users. The browser vendors also meet regularly to decide which codecs should be supported in order for the technology to work. You can read more about the support for various codecs at http://www.webrtc.org/faq.

You could easily write several books on the subject of codecs. In fact, there are many books already written on the subject. Fortunately for us, WebRTC does most of the encoding in the browser layer. We will not worry about it over the course of this book but, once you start venturing past basic video and audio communication, you will more than likely bump heads with codec support.

Transportation layer

The transportation layer is the topic of several other books as well. This layer deals with packet loss, ordering of packets, and connecting to other users. The API makes it easy to deal with the fluctuations of a user's network and facilitates reacting to changes in connectivity.

The way WebRTC handles packet transport is very similar to how the browser handles other transport layers, such as AJAX or WebSockets. The browser gives an easy-to-access API with events that tell you when there are issues with the connection. In reality, the code to handle a simple WebRTC call could be thousands or tens of thousands of lines long. These can be used to handle all the different use cases, ranging from mobile devices, desktops, and more.

Session management

Session management is the final piece of the WebRTC puzzle. This is simpler than managing network connectivity or dealing with codecs but still an important piece of the puzzle. This will deal with opening multiple connections in a browser, managing open connections, and organizing what goes to which person. This can most commonly be called signaling and will be dealt with more in Chapter 4, Creating a Signaling Server.

Included in this array of new features is also support for data transfer. Since a high-quality data connection is needed between two clients for audio and video, it also makes sense to use this connection to transfer arbitrary data. This is exposed to the JavaScript layer through the RTCDataChannel API. We will cover this in more detail at a later point.

WebRTC today has many of the building blocks needed to build an extremely high-quality real-time communication experience. Google, Mozilla, Opera, and many others have invested a wealth of time and effort through some of their best video and audio engineers to bring this experience to the Web. WebRTC even has roots in the same technology used to bring Voice over Internet Protocol (VoIP) communication to users. It will change the future of how engineers think about building real-time communication applications.

Creating web standards

The great thing about the Web is that it moves so fast. New standards are changed or created everyday and it is always improving. Browsers have further improved on this concept by allowing updates to be downloaded and installed without the user ever knowing. This makes the web developer's job an easier one, but it does mean that you have to keep up with what is going on in the world of the Web, and this includes WebRTC.

The way these changes are implemented across browsers is through standardized bodies. These are groups of individuals who work through a common organization to democratize the changing of browser APIs. The two organizations that control the standards for WebRTC are the World Wide Web Consortium (W3C) and the Internet Engineering Task Force (IETC).

Unlike many other standardized organizations, the W3C allows much of its information to be freely available to the public. This means that anyone can go online and view information about the implementation details of an API. The one for WebRTC is located at http://www.w3.org/TR/webrtc/. This is one way to refer to and learn more about how WebRTC works.

Getting involved in these organizations is one way to not only keep up-to-date on the latest technologies, but also to help shape the future of the Web. Participating in these communities makes browsers the fastest growing development stack out there. If you would like to learn more, visit http://www.w3.org/participate/ to find different ways to participate in the discussions.

Browser support

Although the goal of WebRTC is to be ubiquitous for every user, this does not mean that every browser all the same features at the same time. Different browsers may choose to be ahead of the curve in certain areas, which makes some things work in one browser and not another. The current support for WebRTC in the browser space is shown in the following section.

Note

There are multiple websites that can tell you if your browser supports a specific technology, such as http://caniuse.com/rtcpeerconnection, that tells you which browsers support WebRTC.

Compatibility with Chrome, Firefox, and Opera

There are chances that the browser you currently use supports WebRTC. Chrome, Firefox, and Opera all support WebRTC out-of-the-box. This should work on all mainstream OSes, such as Windows, Mac, and Linux, as well. The browser vendors, such as Chrome and Firefox, have also been working together to fix interoperability issues so they can all communicate with each other easily.

Compatibility with Android OS

This is also the case for Chrome and Firefox on Android operating systems as well. WebRTC-based applications should work out-of-the-box and be able to interoperate with other browsers after Android version 4.0 (Ice Cream Sandwich). This is due to the code sharing notion between the desktop and mobile versions of both Chrome and Firefox.

Compatibilty with Apple

Apple has made little effort to enable WebRTC in either Safari or iOS. There are rumors of support but no official date on when support will come about. The one workaround that others have used for hybrid native/web-based iOS applications is to embed the WebRTC code directly into their applications and load a WebRTC application into a WebView.

Compatibility with Internet Explorer

Microsoft has not announced any plans to enable WebRTC in Internet Explorer. They have proposed an alternative solution to enable audio and video communication in the browser. This alternative was turned down in favor of WebRTC. Since then, Microsoft has been a silent partner in the development of the technology.

Note

Throughout the course of this book, it is recommended that you use Chrome for all the examples. Always keep a lookout for updates on browser support, however, as this is a constantly changing space!

Using WebRTC in your browser

Now that you know which browser to use, we will jump right in and try out WebRTC right now! Navigate your browser to the demo application available at https://apprtc.appspot.com/. If you use Chrome, Firefox, or Opera, you should see a drop-down notification that looks similar to this:

Using WebRTC in your browser

Click on Allow to start streaming your audio and video input to the web page. You might have to configure your microphone or web camera settings to get them to work. Once you allow browser access to your camera and microphone, you should see a video feed of yourself from your camera.

The page should generate a custom ID for your current session. You should see this reflected in the URL of the page, such as https://apprtc.appspot.com/r/359323927. Simply copy and paste this URL into another browser window, either on your own computer or another one, and load the web page. Now, if everything works correctly, you should see two video feeds—one from your first client and another from the second. It should start to make sense why WebRTC is a powerful solution. This is how easy WebRTC makes real-time communication in the browser.

Applications enabled by WebRTC

Under the hood, WebRTC enables a basic peer-to-peer connection between two browsers. This is the heart of everything that happens with WebRTC. It is the first truly peer-to-peer connection inside a browser. This also means that anything you can do with peer connections can be easily extended to WebRTC. Many applications today use peer-to-peer capabilities, such as file sharing, text chat, multiplayer gaming, and even currencies. There are already hundreds of great examples of these types of applications working right inside the browser.

Most of these applications have one thing in common—they need a low-latency, high-performance connection between two users. WebRTC makes use of low-level protocols to deliver high-speed performance that could not be achieved otherwise. This speeds up data flow across the network, enabling large amounts of data to be transferred in a short amount of time.

WebRTC also enables a secure connection between two users to enable a higher level of privacy between them. Traffic traveling across a peer connection will not only be encrypted, but will also take a direct route to the other user. This means that packets sent in different connections might take entirely different routes over the Internet. This gives anonymity to users of WebRTC applications that is otherwise hard to guarantee when connecting to an application server.

This is just a subset of the types of applications enabled by WebRTC. Since WebRTC is built on the foundations of JavaScript and the Web, it can benefit many existing applications today. After reading this book, you should have the knowledge you need to create innovative WebRTC applications on your own!

Self-test questions

Q1. The goal of WebRTC is to provide easy access to real-time communication with no plugins or licensing fees. True or false?

Q2. Which of the following is not a feature that the browser provides through WebRTC?

  1. Camera and microphone capture
  2. Video and audio stream processing
  3. Accessing a contact list
  4. Session management

Q3. Participating in the W3C and IETC is only for big corporations with lots of money. True or false?

Q4. Which of the following is not a type of application that could benefit from using WebRTC?

  1. File sharing
  2. Video communication
  3. Multiplayer gaming
  4. None of the above

Summary

In this chapter, we gave you a glimpse of the features and technology behind WebRTC. You should have a firm grasp of what WebRTC aims to achieve and how this affects web applications today. You should also have an idea of what types of applications can be built with WebRTC and you should have tried out WebRTC already in your browser.

There was a wealth of information in this chapter, though if you did not take it all in, do not worry. We will go back and cover many of the topics presented here in detail over the course of the book. Feel free to explore some of the resources already on the Web today to get an even better understanding of what WebRTC is all about.

Next, we will start exploring camera and microphone capture using the getUserMedia API.

Then, we will start building our WebRTC application to handle a full one on one video and audio call directly in the browser.

Later on, we will start exploring how to extend this to multiple users, add data transfer through text-based chat and file sharing, and learn about the best security practices that are in place when using WebRTC.

Left arrow icon Right arrow icon

Description

If you are a web developer who wants to create well designed WebRTC applications for your users, this is the book for you. Even if you are early in your web development career, this book aims to provide a complete understanding of the WebRTC API. It is assumed that you have previous exposure to web development using HTML5 and JavaScript technologies.

Who is this book for?

If you are a web developer who wants to create well designed WebRTC applications for your users, this is the book for you. Even if you are early in your web development career, this book aims to provide a complete understanding of the WebRTC API. It is assumed that you have previous exposure to web development using HTML5 and JavaScript technologies.

What you will learn

  • Understand the underlying platform that WebRTC is built upon
  • Create applications that utilize your web camera and microphone
  • Build your very own signaling server from scratch
  • Enable your applications to communicate with multiple users
  • Share data and files across peertopeer connections using WebRTC
  • Implement best practices to secure and make a WebRTC application perform
  • Get to know more about multipeer mesh networks for more than two users
  • Learn the best practices behind traversing networks, signaling, security, and data transport in WebRTC applications
  • Use full mesh networks, partial mesh networks, and multipoint control units to manage your applications

Product Details

Country selected
Publication date, Length, Edition, Language, ISBN-13
Publication date : Jun 30, 2015
Length: 186 pages
Edition : 1st
Language : English
ISBN-13 : 9781783983667
Languages :
Tools :

What do you get with a Packt Subscription?

Free for first 7 days. $19.99 p/m after that. Cancel any time!
Product feature icon Unlimited ad-free access to the largest independent learning library in tech. Access this title and thousands more!
Product feature icon 50+ new titles added per month, including many first-to-market concepts and exclusive early access to books as they are being written.
Product feature icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Product feature icon Thousands of reference materials covering every tech concept you need to stay up to date.
Subscribe now
View plans & pricing

Product Details

Publication date : Jun 30, 2015
Length: 186 pages
Edition : 1st
Language : English
ISBN-13 : 9781783983667
Languages :
Tools :

Packt Subscriptions

See our plans and pricing
Modal Close icon
$19.99 billed monthly
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Simple pricing, no contract
$199.99 billed annually
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just $5 each
Feature tick icon Exclusive print discounts
$279.99 billed in 18 months
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just $5 each
Feature tick icon Exclusive print discounts

Frequently bought together


Stars icon
Total $ 133.97
WebRTC Blueprints
$45.99
WebRTC Integrator's Guide
$54.99
Learning WebRTC
$32.99
Total $ 133.97 Stars icon

Table of Contents

10 Chapters
1. Getting Started with WebRTC Chevron down icon Chevron up icon
2. Getting the User's Media Chevron down icon Chevron up icon
3. Creating a Basic WebRTC Application Chevron down icon Chevron up icon
4. Creating a Signaling Server Chevron down icon Chevron up icon
5. Connecting Clients Together Chevron down icon Chevron up icon
6. Sending Data with WebRTC Chevron down icon Chevron up icon
7. File Sharing Chevron down icon Chevron up icon
8. Advanced Security and Large-scale Optimization Chevron down icon Chevron up icon
A. Answers to Self-test Questions Chevron down icon Chevron up icon
Index Chevron down icon Chevron up icon

Customer reviews

Rating distribution
Full star icon Full star icon Full star icon Full star icon Empty star icon 4
(5 Ratings)
5 star 40%
4 star 40%
3 star 0%
2 star 20%
1 star 0%
Carlos Camacho Aug 27, 2015
Full star icon Full star icon Full star icon Full star icon Full star icon 5
General pros+ This book is a quite good reference to learn WebRTC, quite basic but it contains a lot of information on how to get it runing using several examples.+ Self tests to check what you have learned.+ Quick explanation.+ Lot of examples.+ To be read in 1 week (1 hour daily).General cons- Not related to the book as this is a basic book, we were trying to reach some scalable broadcasting solution over WebRTC, and there is no solution covered by WebRTC yet.A realy good book.
Amazon Verified review Amazon
Amazon Customer Sep 02, 2016
Full star icon Full star icon Full star icon Full star icon Full star icon 5
great job.Sometimes code quirks especially at dataChannel section.But the code example is well organized and well explained.Thanks
Amazon Verified review Amazon
Sunny Jul 09, 2016
Full star icon Full star icon Full star icon Full star icon Empty star icon 4
A good book to start.
Amazon Verified review Amazon
Yahamid Jul 24, 2015
Full star icon Full star icon Full star icon Full star icon Empty star icon 4
This is my third reading on the topic of WebRTC. Being a person oriented with the topic, I think it's relatively basic for me but still I found some new information out of it here and there.For beginners, I think this is a good book to start with. It's quite short book (cannot tell the number of pages as I read it online in a few hours) but my perception is that anyone with sufficient of understanding of how Web and the Internet works, it will be a quick read along with testing the sample codes.A good thing is that at the end of chapters there are also certain self-test questions, a cool thing!
Amazon Verified review Amazon
Alexander Pabel Mar 27, 2021
Full star icon Full star icon Empty star icon Empty star icon Empty star icon 2
The book is written good and contains lots of informations what is good but unfortunately the code is not working. Maybe because the code is to old and deprecated. For the price of a new book i would expect at least that most of the code is up to date.
Amazon Verified review Amazon
Get free access to Packt library with over 7500+ books and video courses for 7 days!
Start Free Trial

FAQs

What is included in a Packt subscription? Chevron down icon Chevron up icon

A subscription provides you with full access to view all Packt and licnesed content online, this includes exclusive access to Early Access titles. Depending on the tier chosen you can also earn credits and discounts to use for owning content

How can I cancel my subscription? Chevron down icon Chevron up icon

To cancel your subscription with us simply go to the account page - found in the top right of the page or at https://subscription.packtpub.com/my-account/subscription - From here you will see the ‘cancel subscription’ button in the grey box with your subscription information in.

What are credits? Chevron down icon Chevron up icon

Credits can be earned from reading 40 section of any title within the payment cycle - a month starting from the day of subscription payment. You also earn a Credit every month if you subscribe to our annual or 18 month plans. Credits can be used to buy books DRM free, the same way that you would pay for a book. Your credits can be found in the subscription homepage - subscription.packtpub.com - clicking on ‘the my’ library dropdown and selecting ‘credits’.

What happens if an Early Access Course is cancelled? Chevron down icon Chevron up icon

Projects are rarely cancelled, but sometimes it's unavoidable. If an Early Access course is cancelled or excessively delayed, you can exchange your purchase for another course. For further details, please contact us here.

Where can I send feedback about an Early Access title? Chevron down icon Chevron up icon

If you have any feedback about the product you're reading, or Early Access in general, then please fill out a contact form here and we'll make sure the feedback gets to the right team. 

Can I download the code files for Early Access titles? Chevron down icon Chevron up icon

We try to ensure that all books in Early Access have code available to use, download, and fork on GitHub. This helps us be more agile in the development of the book, and helps keep the often changing code base of new versions and new technologies as up to date as possible. Unfortunately, however, there will be rare cases when it is not possible for us to have downloadable code samples available until publication.

When we publish the book, the code files will also be available to download from the Packt website.

How accurate is the publication date? Chevron down icon Chevron up icon

The publication date is as accurate as we can be at any point in the project. Unfortunately, delays can happen. Often those delays are out of our control, such as changes to the technology code base or delays in the tech release. We do our best to give you an accurate estimate of the publication date at any given time, and as more chapters are delivered, the more accurate the delivery date will become.

How will I know when new chapters are ready? Chevron down icon Chevron up icon

We'll let you know every time there has been an update to a course that you've bought in Early Access. You'll get an email to let you know there has been a new chapter, or a change to a previous chapter. The new chapters are automatically added to your account, so you can also check back there any time you're ready and download or read them online.

I am a Packt subscriber, do I get Early Access? Chevron down icon Chevron up icon

Yes, all Early Access content is fully available through your subscription. You will need to have a paid for or active trial subscription in order to access all titles.

How is Early Access delivered? Chevron down icon Chevron up icon

Early Access is currently only available as a PDF or through our online reader. As we make changes or add new chapters, the files in your Packt account will be updated so you can download them again or view them online immediately.

How do I buy Early Access content? Chevron down icon Chevron up icon

Early Access is a way of us getting our content to you quicker, but the method of buying the Early Access course is still the same. Just find the course you want to buy, go through the check-out steps, and you’ll get a confirmation email from us with information and a link to the relevant Early Access courses.

What is Early Access? Chevron down icon Chevron up icon

Keeping up to date with the latest technology is difficult; new versions, new frameworks, new techniques. This feature gives you a head-start to our content, as it's being created. With Early Access you'll receive each chapter as it's written, and get regular updates throughout the product's development, as well as the final course as soon as it's ready.We created Early Access as a means of giving you the information you need, as soon as it's available. As we go through the process of developing a course, 99% of it can be ready but we can't publish until that last 1% falls in to place. Early Access helps to unlock the potential of our content early, to help you start your learning when you need it most. You not only get access to every chapter as it's delivered, edited, and updated, but you'll also get the finalized, DRM-free product to download in any format you want when it's published. As a member of Packt, you'll also be eligible for our exclusive offers, including a free course every day, and discounts on new and popular titles.