October 1, 2020
CSS Tricks
#
CSS can be used to trick a user into exposing information such as embedded pixel values by making visual changes that are affected by the embed.
Retrieving user’s history
#
Using the CSS :visited
selector, it’s possible to apply a different style for URLs that have been visited.
Previously it was possible to use getComputedStyle()
to detect this difference, but now browsers prevent this by always returning values as if the link was visited and limiting what styles can be applied using the selector.
So, it may be needed to trick the user into clicking an area that the CSS has affected.
This can be done using mix-blend-mode
.
There are also ways to do it without user interaction such as by abusing render timings.
This works because it takes time to paint links in a different color.
A Proof of Concept to this attack can be found in a Chromium report and it works by having multiple links to increase the time difference.
...October 1, 2020
Window references allow cross-origin pages to get access to some of the attributes of other pages. These references become available when using or allowing iframe
and window.open
. The references provide (limited) information about the window as they still respect the same-origin policy.
One of the accessible attributes is window.length
which provides the number of frames in the window. This attribute can provide valuable information about a page to an attacker.
...October 1, 2020
Detecting if a cross-site page triggered a navigation (or didn’t) can be useful to an attacker. For example, a website may trigger a navigation in a certain endpoint depending on the status of the user.
To detect if any kind of navigation occurred, an attacker can:
- Use an
iframe
and count the number of times the onload
event is triggered. - Check the value of
history.length
, which is accessible through any window reference. This provides the number of entries in the history of a victim that were either changed by history.pushState
or by regular navigations. To get the value of history.length
, an attacker changes the location of the window reference to the target website, then changes back to same-origin, and finally reads the value. Run demo
Download Trigger
#
When an endpoint sets the Content-Disposition: attachment
header, it instructs the browser to download the response as an attachment instead of navigating to it. Detecting if this behavior occurred might allow attackers to leak private information if the outcome depends on the state of the victim’s account.
...October 1, 2020
Network Timing side-channels have been present on the web since its inception . These attacks have had different levels of impact over time, gaining new attention when browsers started shipping high-precision timers like performance.now().
To obtain timing measurements, attackers must use a clock, either an implicit or an explicit one. These clocks are usually interchangeable for the purposes of XS-Leaks and only vary in accuracy and availability. For simplicity, this article assumes the use of the performance.now()
API, an explicit clock present in all modern browsers.
...October 1, 2020
Measuring the time of JavaScript execution in a browser can give attackers information on when certain events are triggered, and how long some operations take.
Timing the Event Loop
#
JavaScript’s concurrency model is based on a single-threaded event loop which means it can only run one task at a time. If, for example, some time-consuming task blocks the event loop, the user can perceive a freeze on a page as a result of the UI thread being starved. Other tasks must wait until the blocking task finishes. Each browser implements different process models, which means some web sites might run in different threads (and event loops) depending on their relations.
...October 1, 2020
The id
attribute is widely used to identify HTML
elements. Unfortunately, cross-origin websites can determine whether a given id
is set anywhere on a page by leveraging the focus
event and URL
fragments. If https://example.com/foo#bar
is loaded, the browser attempts to scroll to the element with id="bar"
. This can be detected cross-origin by loading https://example.com/foo#bar
in an iframe; if there is an element with id="bar"
, the focus
event fires. The blur
event can also be used for the same purpose .
...