HTML anchor tags are used to link to different web pages available on the internet. We also frequently use “target” attribute with the anchor tags so that the linked web page is opened in a separate new window. This is achieved by using the anchor tag like this:
<a href="https://muddoo.com" target="_blank"title="Muddoo Home">Home</a>Note that in the above code we set the “target” value to be _blank, which would result in the linked web page (https://muddoo.com in this case) to be opened in a new window.
However, it has been found that this can leave a possible vulnerability where in the remotely linked web page can take over control of your web page.
Why does this vulnerability happen?
This vulnerability of remotely linked web page taking over your web page (that is having the anchor tag) is because of the following reasons:
- In normal scenario, whenever you open a new web page in your browser in a new window, the web page is running in its own separate thread.
- Now when we open a link present in that web page, the new linked web page gets opened in a new window due to the presence of “target” attribute of the anchor tag. However, in this scenario, the newly opened web page is also running under its parent’s thread itself instead of its own thread.
- As a result, the newly opened external web page has controls over its parent’s thread. There by creating a vulnerable situation!
How to overcome anchor tag’s “target” vulnerability?
We can overcome this “target” thread control vulnerability simply by introducing a new attribute to your anchor tags called the rel=”noopener” attribute.
Thus, the new fixed anchor tag would look something like this:
<a href="https://muddoo.com" target="_blank"title="Muddoo Home" rel="noopener">Home</a>With this simple change, we can ensure that the newly opened web page runs in it’s own thread there by having no link to it’s parent thread in any way!
Hope you are now aware of this possible vulnerability and ensure you start using the rel=”noopener” attributes to all your web pages’ external links!
Happy coding! 🙂
Note: This article is continuation of my previous article Introduction To HTML Anchor Tag