Безопасное взаимодействие всплывающих окон с помощью свойств ограничения

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

Arthur Hemery
GitHub
Мод Налпас

Для параметра Cross-Origin Opener Policy (COOP) доступно новое значение: restrict-properties . Оно обеспечивает преимущества в плане безопасности и упрощает внедрение междоменной изоляции , позволяя при этом вашему сайту взаимодействовать со сторонними всплывающими окнами для осуществления платежей, аутентификации или других целей.

Чтобы начать экспериментировать с restrict-properties примите участие в пробном запуске, начиная с Chrome 116 .

Зачем использовать restrict-properties

restrict-properties имеет два основных варианта использования:

Предотвратите утечки между объектами без повреждений.

По умолчанию любой веб-сайт может открыть ваше приложение во всплывающем окне и получить на него ссылку.

Вредоносный веб-сайт может использовать это в своих интересах для проведения атак, таких как утечки межсайтовой информации . Для снижения этого риска можно использовать заголовок Cross-Origin-Opener-Policy (COOP).

До настоящего момента ваши возможности в отношении Cross-Origin-Opener-Policy были ограничены. Вы могли либо:

  • Установите параметр same-origin, который блокирует все взаимодействия с всплывающими окнами из разных источников.
  • Установите параметр same-origin-allow-popups , который блокирует все междоменные взаимодействия, приводящие к открытию вашего сайта во всплывающем окне.
  • Установите параметр unsafe-none , который разрешает все междоменные взаимодействия с всплывающими окнами.

Это сделало невозможным для веб-сайтов, которые должны открываться во всплывающем окне и взаимодействовать с открывающим их окном, обеспечение COOP (безопасности взаимодействия между сайтами). В результате ключевые сценарии использования, такие как единый вход и платежи, остались незащищенными от межсайтовых утечек.

Cross-Origin-Opener-Policy: restrict-properties решает эту проблему.

С помощью restrict-properties свойства, которые могут использоваться для подсчета кадров и других атак с утечкой межсайтовых данных, недоступны, но разрешена базовая связь между окнами через postMessage и closed .

Это повышает безопасность сайта, сохраняя при этом ключевые сценарии его использования. Например:

  • Если вы предоставляете услугу во всплывающем окне, установка параметра Cross-Origin-Opener-Policy: restrict-properties защитит вас от ряда атак типа «утечка межсайтовых данных». Вы по-прежнему сможете открывать все страницы, которые могли открывать ранее.
  • Если вам необходимо открыть всплывающее окно, доступное из другого источника, установка Cross-Origin-Opener-Policy: restrict-properties аналогичным образом защитит ваш сайт от подсчета iframe-элементов. Вы сможете открывать тот же набор всплывающих окон, что и сегодня.
  • Если заголовок установлен как для пользователя, так и для открывающего страницу, и страницы находятся в разных местах, то поведение аналогично тому, как если бы заголовок был установлен одним из них. Если же страницы находятся в одном месте, предоставляется полный доступ.

Обеспечьте кросс-доменную изоляцию вашего сайта.

Почему нам необходима изоляция между источниками

Некоторые веб-API повышают риск атак по побочным каналам, таких как Spectre . Для снижения этого риска браузеры предлагают изолированную среду, активируемую по желанию пользователя, называемую междоменной изоляцией . В состоянии междоменной изоляции веб-страница может использовать привилегированные функции, включая SharedArrayBuffer , performance.measureUserAgentSpecificMemory() и высокоточные таймеры с лучшим разрешением, изолируя при этом свой источник от других, если они не активированы.

До сих пор для использования этих API необходимо было установить Cross-Origin-Opener-Policy: same-origin . Однако это нарушало работу любых всплывающих окон, открываемых из разных источников, например, для единого входа и платежей.

Теперь вместо Cross-Origin-Opener-Policy: restrict-properties Cross-Origin-Opener-Policy: same-origin properties для обеспечения междоменной изоляции. Вместо разрыва отношений между открывающим сервером, это просто ограничивает их минимальным подмножеством обмена данными, включающим window.postMessage() и window.closed .

Вы сможете включить междоменную изоляцию с помощью следующих двух заголовков:

Cross-Origin-Opener-Policy: restrict-properties
Cross-Origin-Embedder-Policy: require-corp

или

Cross-Origin-Opener-Policy: restrict-properties
Cross-Origin-Embedder-Policy: credentialless

Подробнее о credentialless см. в статье «Загрузка ресурсов из разных источников без заголовков CORP с использованием COEP: credentialless .

Демо

В этом демонстрационном примере с изоляцией от разных источников вы можете попробовать различные варианты заголовков.

Эксперимент с исходным испытанием

Чтобы поэкспериментировать с Cross-Origin-Opener-Policy: restrict-properties , примите участие в пробном периоде использования источника .

Поддержка браузеров

Cross-Origin-Opener-Policy: restrict-properties в настоящее время поддерживается только в Chrome. Другие браузеры активно участвуют в обсуждении стандартизации .

Часто задаваемые вопросы

Моему веб-сайту необходимо взаимодействовать с всплывающими окнами из одного источника. Следует ли мне использовать COOP: restrict-properties для обеспечения изоляции между источниками?

Установка COOP: restrict-properties как для всплывающего окна, так и для главной страницы не приведет к ограничениям. Установка этого параметра только для всплывающего окна или только для главной страницы предотвратит доступ к любым свойствам, кроме postMessage и closed , для любого открывающего окна, даже если они имеют один и тот же источник.

Является ли набор допустимых свойств фиксированным?

Судя по полученным отзывам, для большинства рабочих процессов достаточно свойств window.postMessage и window.closed , но мы всё ещё рассматриваем возможность расширения функционала за счёт других свойств. Если у вас есть задача, которую нельзя решить, используя только postMessage и closed оставьте свой отзыв в теме «Замысл эксперимента» .

Ресурсы