Чем опасен target=_blank

неочевидный вред использования значения _blank для атрибута target

2023-05-13 I Shar

время чтения 2 мин.

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

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

Угрозы

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

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

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

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

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

Кейс

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

Решение

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




rel="noopener" не позволяет браузеру получить информацию о сайте,

rel="noreferrer" блокирует referrer в HTTP-заголовке.

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



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

I Shar