HTML-ссылки являются инструментом объединяющим веб-страницы в сайты. Сегодня мы поговорим о том, как такой важный и замечательный инструмент может быть использован для нанесения вреда не только Вашему веб-ресурсу, но, возможно, и пользователям. К сожалению, многие веб-разработчики часто забывают об этой довольно старой и распространенной угрозе.

Итак, веб-сайт - это коллекция страниц, объединенных общим адресом в сети интернет и, обычно, физически размещенных на одном сервере. Ссылки являются главным связующим компонентом. Если не будет ссылок, не будет и сайта - останется просто коллекция разрозненных веб-страниц.

Угрозы

Поговорим о ссылках. Когда Вы открываете ссылку в новой вкладке с помощью значения "_blank" атрибута target тега <a>, браузер сохраняет информацию о “старой” или, другими словами, ссылающейся странице. Выглядит разумно и безобидно, не так ли?

К сожалению это не так: таким образом браузер позоволяет получить контроль над ссылающейся страницей через свойство window.opener, обеспечивающее частичное взаимодействие со страницей - источником ссылки.

Каким образом можно использовать полученные возможности:

1. Можно запустить скрипт, который будет негативно влиять на производительность страницы,
2. Можно подменить ссылающуюся страницу на фишинговую.

Избежать вероятных неприятных последствий можно с помощью атрибута rel, но об этом чуть позже…

Кейс

1. Пользователь кликает по ссылке и переходит на страницу внешнего ресурса в новой вкладке,
2. Злоумышленник с помощью JavaScript через window.opener.location подменяет ссылающуюся страницу (ту самую страницу, с которой пользователь перешел на внешний ресурс) на фишинговую,
3. Пользователь не видит причин не доверять странице ранее открытой в другой вкладке, возвращается назад и попадает в ловушку.

Решение

Для предотвращения возможных негативных последствий нужно использовать атрибуты rel="noopener" или rel="noreferrer" вместе с Вашим <a target="_blank" href...:

1. rel="noopener" не позволяет браузеру получить информацию о сайте,
2. rel="noreferrer" блокирует referrer в HTTP-заголовке.

Как этим пользоваться?

Полную уверенность в обеспечении безопасности ссылающейся страницы даст только совместное использование значений noopener и noreferrer. Это связано с тем, что не все браузеры поддерживают noopener, но все поддерживают noreferrer.

Например:

<a rel="noopener noreferrer" href="https://demo.site/html-link.html" target="_blank">Ссылка</a>

Спасибо за внимание.