noopener и noreferrer в браузере

  —  2 минуты

#theory#useful#web
Читать статью в Telegram

При открытии ссылки в новой вкладке через атрибут target="_blank", браузер делает несколько не самых желанных для нас действий, от которых и спасают атрибуты noopener и noreferrer

Атрибут noopener предотвращает доступ новой вкладки к объекту window.opener.

Почему это важно? Без этого атрибута, сайт, открытый в новой вкладке, может получить доступ к оригинальной вкладке и потенциально выполнить вредоносный код, что представляет угрозу безопасности.

window.opener содержит слепок объекта window для страницы, с которой был открыт сайт. Информация в таком объекте всё же сильно ограничена — новая вкладка не может получить доступ, например, к переменным с прошлой страницы, зато может осуществлять навигацию по старой вкладке, что открывает огромные возможности для фишинга.

Представим, что вы находитесь на каком-нибудь some-bank.com и переходите на другой сайт с вредоносным кодом без noopener.

Тогда новая вкладка может получить доступ к pathname откуда вы перешли и к API навигации по старой вкладке, и, уже абсолютно невидимо для вас, средиректить старую вкладку с some-bank.com на some-bauk.com (подмена символа в слове bank).

Вернувшись на старую вкладку, вы увидите тот же сайт, но проблема в том, что он уже подменён на фишинг-страницу. Входите через эту страницу в личный кабинет банка и все данные улетают злоумышленникам.

Такая атака, кстати, называется tabnabbing

Атрибут noreferrer выполняет сразу две функции:

  1. Предотвращает доступ к window.opener, как и noopener
  2. Удаляет HTTP-заголовок Referer при переходе по ссылке, что скрывает источник перехода
text
1Referer: https://some-bank.com/login
2

Для нас это просто дополнительная защита, которая запрещает ещё один способ просмотреть url, с которого открыта страница

Обычно эти атрибуты используют в паре. noreferrer как бы включает в себя noopener, а значит вроде бы можно использовать только его, но на практике так никто не делает. Связано это попросту с тем, что каждый браузер Referrer-Policy раньше реализовал по своему, да и так просто спокойнее что ли

Статья была полезной?