The new HTML5 video\audio API has privacy issues on desktop Chrome

HTML 5 new API allows us to grab the audio\video output right from the browser. No need for cumbersome native Windows interfaces or weird browser plugins. Both Firefox and Chrome (and Edge soon) allow any JavaScript code to gain access to the laptop\tablet\phone\whatever camera and microphone.

This is great, since it enables some great application like Google Hangouts and a lot of other video chats sites. But it also has some security hazards. To deal with those hazards, the browsers developers created two barriers that should prevent or at least mitigate privacy violation.

const constraints = {
audio: true,
video: true
};
navigator.mediaDevices.getUserMedia(constraints).
then((stream) => {
handleSuccess(stream); // This is basic handler with stream input.
});

This is the base JavaScript code of initiating the access to the audio and video devices. Running it will cause the browser to ask the user to grant a general usage permission. In Chrome, the permission request is the same as any other requests.

Different types of permission request in Chrome browser

I am sure that a lot of users, maybe even you, approved one of those requests. Since a lot of news sites asks for notification permission and a lot of restaurants\hotels\services sites asks for location permission — users are starting to just approve those requests and not think about it much.

But fear not! there is another, important, line of defense. After getting the user general permission for video and audio usage, the developer get access to the stream of data from those devices. But in order to use this stream, the developer needs to record it. It is done by using MediaRecorder API.

const recordedBlobs = [];
const mediaRecorder = new window.MediaRecorder(window.stream,{ mimeType: 'audio/mpeg' });
mediaRecorder.ondataavailable = (event) => {
recordedBlobs.push(event.data);
};
mediaRecorder.start();

Activating this API will alert the user that the audio or video from one of the devices is being captured. Chrome and Firefox implemented this alert (Recording media is not available in Edge yet).

Record indication on Firefox and Chrome

This record indication is the last and the most important line of defense. The general video\audio device permission is required one time only and user can err and grant it by mistake. Once you granted it, that’s it. The record alert is given on ANY stream record usage and will prevent any record without the user knowledge. That’s what I thought.

But it seems that this is not always the case. Developers can exploit small UX manipulation to activate the MediaRecorder API without alerting the users. The process is quite simple. After granting the general access from the user — Open a headless window and activate the MediaRecorder from that window. In Chrome there will be no visual record indication.

You can visit the small demo page that I made. In the page there are two buttons. The first one is just asking the device permission. A lot of sites asks these and a lot of users give it without further thinking. The second button is simulating the attack — The process is easy: open headless window and start record the user. After 30 seconds You can download MP3 of a record from your computer.

Real attack will not be very obvious of course. It can use very small pop-under and submit the data anywhere and close it when the user is focusing on it. It can use the camera for millisecond to get your picture. It can (In theory) use XSS to ride on legitimate sites and their permissions. The sky is the the limit here.

I’ve reported Chromium about this issue but unfortunately it was not classified as high urgent issue.

In Mobile there is not such visual indication, But users are more alerted there regarding the browser permission. At least I hope.

Connect with me via LinkedIn For more stories and insight.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.