Сышышь ты, выходи сюда,
поговорим !

Безопасность и производительность ваших ссылок target = _blank with rel = noopener

  1. Атрибут target = "_ blank" в ваших ссылках, проблема безопасности
  2. Решите проблемы с rel = "noopener"
  3. rel = "noreferrer" и rel = "noopener" на всех ваших ссылках?

Год назад, почти сегодня, мы объявили об обновлении эталона положительного опыта наших служба веб-аналитики , Это обновление включало контрольную точку для атрибутов гиперссылок, чтобы открывать ссылку в новом окне или вкладке (target = "_ blank").

Последняя версия Firefox присоединилась к Google Chrome, поддерживая атрибут rel = "noopener", одно из предложенных нами решений. Давайте возьмем время, чтобы вернуться к этой рекомендации, которую мы сделали для целей безопасности, но которая также отвечает на проблемы производительности.

Атрибут target = "_ blank" в ваших ссылках, проблема безопасности

Матиас Биненс очень ясно проиллюстрировал это: использование атрибута target = "_ blank" в гипертекстовой ссылке позволяет открытой веб-странице вызывать изменение страницы в исходном окне. Его статья также предлагает демонстрационные страницы, если вы хотите просмотреть проблему.

Вкратце: если вы разрешаете пользователям публиковать ссылки на ваш сайт и они используют атрибут target = "_ blank", вы можете ожидать, что злоумышленник перенаправит пользователя на другую страницу. Не на вкладке, которая была открыта при нажатии на ссылку, а на исходной вкладке (ваш сайт). И это без предупреждения. Метод, который может быть очень эффективным, например, для фишинга.

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

Как показал Джейк Арчибальд Открытые ссылки в новых окнах также влияют на производительность. Здесь вы снова найдете в статье демонстрационную страницу.
Проблема заключается в том, что в большинстве браузеров, когда вы открываете новое окно или новую вкладку с существующей страницы, оба окна обнаруживают общий системный процесс. Обычное использование этого процесса может привести к помехам между двумя интенсивными процессами в неактивном окне, которые могут повлиять на текучесть страницы, используемой пользователем.

Решите проблемы с rel = "noopener"

Прежде всего, помните, что самое простое решение - не использовать target = "_ blank", что может пойти вразрез с хорошими методами обеспечения доступности, если пользователь не проинформирован об этом поведении (например, напомнить Opquast хранилище ).

Если вам нужно использовать этот атрибут, то вы должны добавить еще один атрибут: rel = noopener. Этот атрибут обнуляет значение window.opener (что запрещает любое изменение URL на вызывающей странице).

opener (что запрещает любое изменение URL на вызывающей странице)

Несмотря на недавнюю поддержку (начало марта 2017 года) этой функции Firefox, о которой было объявлено во введении, совместимость браузера с rel = "noopener" все еще слишком ограничен, чтобы считать, что это позволит вам решить проблему безопасности.

Затем вы можете обратиться к rel = noreferrer, широко поддерживаемому, что даст тот же эффект. Но, как следует из названия, он также будет отказывать сайту назначения в получении заголовка HTTP Referer, который обеспечивает источник трафика.

rel = "noreferrer" и rel = "noopener" на всех ваших ссылках?

Если вы принимаете полезный контент, который может содержать ссылки (как правило, комментарии в блоге), не используйте target = "_ blank" или предпринимайте необходимые действия. Для внешних ссылок, за которые вы несете ответственность, угроза безопасности значительно снижена, поскольку ее использование подразумевает, что злоумышленник внедряет JavaScript на связанной странице. Наконец, если речь идет о внутренних ссылках, риск для безопасности не возникает, но ставки производительности сохраняются.

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

Думать о регулярно проверяйте свой сайт с помощью Dareboost проверить применение этой передовой практики на своих страницах и воспользоваться всеми другими нашими пунктами контроля качества.

Rel = "noreferrer" и rel = "noopener" на всех ваших ссылках?