Recently, a post about Hacking the <a> tag in 100 characters made its rounds on the internet.
A short summary of this post is that it’s possible to change the link target (the
href attribute) just after it’s clicked, but before the target is loaded. This means that hovering over a link and seeing a target such as http://paypal.com you might actually be redirected to some phishing page.
Here’s an easy js-fiddle demonstrating the issue which actually presents a popup before you are redirected (see the Result tab for the demo):
So you might think this is bad and maybe you’re right. Bilaw suggests that browsers should notify their users in case the link target was changed in between click and following the link in his post.
While this might seems legit, it’s actually not that simple: There’s at least two alternatives to achieve the same linkception (not the SEO term) without changing the link target:
- You can just “redirect” the click to another link. That other link can even be hidden.
- You can stop the click event and just load another page.
Both are shown in the js-fiddle below:
So fixing this kind of phishing attack isn’t all that simple. You could argue that you shouldn’t be able to bind anything to click events on
a-tags, but then there are some good use-cases for this (like you want to make the user confirm following a link).
As it’s quite simple to obfuscate the few examples i’ve shown with callbacks, timers, etc., i’m quite sure that fixing them wouldn’t be the end of the arms race. Maybe the only thing we can actually do is raise awareness.
PS: Depending on your browser the click event is triggered on different actions: Firefox only triggers it on left mouse-button click, Chrome also on middle mouse-button click. Both trigger the click event on CTRL/CMD+left mouse-button (opening the link in a new tab), both don’t trigger the event on right click + open in new tab.