There are three types of web pages.
- Don't need to be shown in iframes but have no X-Frame-Options. Basically 99% or more of pages, CJ only exist due to poor design of web which made framing of cross domain pages possible without their consent...
- A little bit later people created X-Frame-Options header which modern websites use to prevent CJ.
- But there is another kind of pages - widgets. They do need to be shown in iframes but they never want to have opacity=0 or be UI-redressed.
To this particular problem, "likejacking", there is no solution and nobody is really planning to do anything about it.
Recently I created the Detector platform which can be used to leak visitor's identity and his profile URL. The most expected reply was "Look, Clearclick blocks it". This is a quote about ClearClick:
NoScript's ClearClick is "the only freely available product that offers a reasonable degree of protection" against ClickjackingYes and no: Yes it's the only available product but No, degree of protection is not so reasonable.
For starters it doesn't prevent any UI redressing attacks, attackers can abuse your avatar and name easily. It only tries to prevent CJ, but here are some tricks to bypass it too.
Trick 1. Set opacity=1 before the click.
We don't know when exactly user is going to click but making the iframe visible 200-400 ms after the cursor was moved to the right position is a good chance to bypass Clearclick. Obvious, more or less reliable.
Trick 2. Put the target area in the top left corner.
There's a weird bug in NoScript: when it snapshots your screen it includes the area beyond top left corner. Which means you can leave tiny but visible (opacity=1) click-able area in the top left corner and trick user into clicking that small link/button.
Trick 3. Double click.
Doubleclicks are rare on the Internet. But don't be afraid to ask visitors to make a doubleclick. Add a transparent div to catch the first click, then hide it and set target iframe's opacity to 1, 500 ms later hide the iframe too.
<div style="width:100%;height:100%;left:-30px;top:-30px;position:absolute;opacity:0;" onclick="this.style.display='none';li.style.opacity='1';"></div>
Cannot we fix the "likejacking" problem in browsers by adding X-Frame-Options:Visible option making the page always 100% visible (opacity=1; z-index=always on top)? I know, web standards used to be very reluctant to proposals, but taking into account Content Security Policy, can we do something about it too?