Manipulating Vulnerability HTML5 to Steal Sensitive Data

TwitterGoogle+FacebookLinkedInPinterestTumblrStumbleUponRedditShare This

Alvin Bryan

Alvin Bryan is a freelance writer and online privacy enthusiast enthusiast currently contributing quality tips and troubleshooting on personal VPN services, and online privacy and security news. You can also find him on Google +.

html5 vulnerabilityHTML 5 along with other technologies developed alongside it have brought many new features to web browsers. But because of an HTML 5 vulnerability, some of these exciting new features are actually threats to online security and privacy. Pixel perfect timing attacks in particular can be used by malicious web pages to steal data from browsers. They break cross-origin restrictions and acquire sensitive data that can be used to steal from online accounts.

HTML5 Vulnerability in requestAnimationFrame API Manipulation

There is an HTML vulnerability that can be used to time how long it takes for browsers to render. This is the requestAnimationFrame API, a JavaScript API that was designed so that website pages can create smooth animation features. The API calls back a function just before the next frame is painted to the screen, and this callback function is passed a timestamp. This is used to determine what sensitive data has been input based on timing data. This API can be used to execute timing attacks against Chrome, Firefox and Internet Explorer. It can infer browsing history and read cross-origin data that is taken from other websites.

pixel perfect html5 vulnerabilityThe callback feature was designed so that developers can perform necessary tasks between animation frames. These tasks include inserting elements for layout and painting. The variety of tasks that can be done take different amounts of time to complete. The task types can then be inferred by the timestamps. When JavaScript code is executed, the position of new and updated elements and drawing the elements to the screen can be calculated. Complex tasks take longer, and simple ones shorter. The requestAnimationFrame synchronizes the JavaScript code execution with a browser’s layout and rendering routines. In this way, a web page can measure browser performance, and this data can be used to execute timing attacks. If the browser function takes place during the layout or painting steps, can be triggered from JavaScript, and takes a variable amount of time depending on the data being fed in, it can be inferred whether or not sensitive data is being processed. That the data cannot be read directly using JavaScript is another clue. Sensitive information passed to a malicious web page can then be read.

Browser History HTML5 Vulnerability

One technique using the requestAnimationFrame API reads the browser history by detecting redraw events. Unlike previous browser history sniffing techniques, this method does not require any interaction with the user. This makes the process faster and sneakier, and therefore more dangerous.

timing attack html5 vulnerabilityWhen we visit links on a website, the browser helps us remember what links we have opened by changing the display color of the link on the page. To do this, every browser needs a database of visited and unvisited links. The next time you go to the page where the links are, the browser will redraw that links that you have already clicked on. The visited or unvisited status should be visible to users and not to the website, and it usually isn’t because the redraw happens so fast. But malicious websites can slow down the process to make redraws detectable. Malicious pages can also apply CSS to the links that are used to execute the timing attack so that they are not visibly displayed.

SVG Filter HTML5 Vulnerability

Another technique uses SVG filters to read pixel values from a web page. Browsers today allow web pages to create rich and interactive graphics. Complex graphics features are vulnerable to timing attacks. Filter Effects is a specification that allows developers to use CSS properties to apply visual effects to web pages. Filter Effects combines SVG filters, predefined CSS filters and WebGL shaders. It allows the application of SVG filters to HTML elements using CSS. The GLSL ES-based shader language from WebGL allows developers to apply complex pixel and vertex shaders to HTML elements also via CSS.

SVG Filter html5 VulnerabilityThe pixels that are taken from cross-origin iframes and images are read by malicious webpages using an OCR-style technique to retrieve sensitive data from websites where they are entered. The same method can be applied to CSS shaders to read cross-origin HTML content. Filters can be applied to arbitrary HTML content, including cross-origin iframes and links, which is where the vulnerability lies. A noisy image takes longer to filter than a flat image does. The noisy and flat difference can be applied to filters to differentiate between visited and unvisited links. If SVG filters are found and analyzed to reveal variable timing for their application, timing attacks become possible. And they can be, by using simple CSS to make visited and unvisited links differ.

SVG filters can be used to distinguish images, and so it can be used to read arbitrary pixel values, like pixels from a cross-origin iframe. Malicious websites can load a site that a user is logged into as an iframe, then use the feMorphology timing attack to read each pixel and build the entire image. By applying SVG filters to the iframe, images can be converted to monochrome so that all pixels become black or white, i.e. flat or noisy. CSS transforms are used to enlarge pixels from the iframe, and CSS image-rendering is used to determine the scaling algorithm used. From this, a text-reading algorithm is easily created. Fonts and where the sensitive information is located on a page can be easily determined by looking at the source code of a page. Malicious websites can then quickly read usernames and other sensitive information that is on a website in text form.

Protecting Web History with a VPN

VPN html5 VulnerabilityThe HTML5 vulnerability proves that even if you disable cookies and delete your browsing history, you can be tracked and your data stolen when you are active on the Internet. A browsing session lasts 7 hours for the average Internet user, and this is plenty of time for malicious websites to get hold of sensitive data through the above techniques. Without a VPN, users are vulnerable to these attacks. VPNs can protect users from the requestAnimationFrame API HTML5 vulnerability by shielding users’ traffic data. It also gives users alternate IP address options so that users are not detected by browsers or websites as returning visitors. This makes it more difficult for hackers to use the HTML5 vulnerability to determine visited and unvisited pages.

VPN security is a necessity these days with all the sophisticated attacks that are being developed all the time. The HTML5 vulnerability is just one of the latest security holes that hackers are exploiting to get to sensitive user data. VPN technology is what can protect users from various online attacks while developers come up with security solutions to keep hackers out.

Read the complete Pixel Perfect Timing Attacks White Paper.