Если

window.parent === window

тогда ваша страница не внутри iframe. Тем не менее, это надежно только в том случае, если у вас одинаковое происхождение. Поскольку ваш сценарий полностью посвящен случаям, когда происхождение не то же самое, вам понадобится более аккуратное решение. Способ решения этой проблемы — убедиться, что ваша страница будет отображаться только в том случае, если она получит сообщение.

Шаги для реализации этого:

1. Убедитесь, что страница не загружает вашу фактическую структуру при GET.

Убедитесь, что на вашей странице есть правильный head, теги link, script и meta и пустой body.

2. Убедитесь, что ваш скрипт, встроенный в iframe, имеет обработчик postMessage.

Про postMessage читайте здесь. Пример с этой страницы:

window.addEventListener(
  "message",
  (event) => {
    if (event.origin !== "http://example.org:8080") return;

    // …
  },
  false,
);

Убедитесь, что внутри data вы передаете что-то, что проверяет отображаемую страницу, например токен, понятный вашему серверу.

3. Отправить запрос со страницы при получении токена на сервер

Итак, вы получили data, давайте убедимся, что вы отправили его на сервер и, если оно действительно, получите содержимое, которое вы хотели отобразить, и добавите его в body как innerHTML. Упрощенным решением было бы создать на вашем сервере одноразовый буквенно-цифровой токен (возможно, случайный текст), который связан с хостом страницы, на которую должен быть встроен ваш iframe, и как только ваш сервер получит этот запрос, проверьте, является ли токен существует и связан с конкретным хостом, который отправил вам хост, ответьте на запрос действительным содержимым (если токен действителен) или сообщением об ошибке (если токен недействителен) и, конечно же, удалите токен после проверки. , но прежде чем ответить.

4. Скрипт для встраивания родительской страницы

Реализуйте сценарий Javascript, который

• будет встроен в страницы, которые встраивают вашу страницу в iframe
• проверяет, существует ли iframe, и указывает на ожидаемое место
• отправляет запрос на сервер, запрашивая токен
• запускает событие сообщения, ориентируясь на вашу страницу iframe и передавая токен (вызовите postMessage и передайте действительные данные, включая токен)

Я нашел способ сделать это, который работает только с современными браузерами (достаточно хорош для меня) и работает в моем конкретном контексте.

Почему и как это работает в моем контексте:

• мой iframe получает определенные значения в первом запросе со страницы, на которой он находится в iframe (набор параметров запроса в URL-адресе).
• мое приложение iframed затем сохраняет это в сеансе (я выполняю весеннюю загрузку с использованием Kotlin), а идентификатор сеанса сохраняется в виде файла cookie в браузере.
• при следующем взаимодействии в этом iframe данные сеанса видны и, таким образом, позволяют выполнить следующие шаги.

Проблема в том, что если ПОСЛЕ того, как вы это сделали (т. е. существует файл cookie с активным сеансом), а затем откройте URL-адрес iframed в отдельном окне вне ситуации iframed; это будет работать (чего я не хочу).

Пробуя что-то, я заметил сообщение в консоли браузера

• Хром: Third-party cookie will be blocked in future Chrome versions as part of Privacy Sandbox..
• Край: Third-party cookie will be blocked in future Microsoft Edge versions as part of unpartitioned third-party cookie deprecation.

Итак, я немного покопался в этом разделении, и оказалось, что если файл cookie разделен, то у него будет отдельная область действия внутри и снаружи iframe.

• https://developer.mozilla.org/en-US/docs/Web/Privacy/Privacy_sandbox/Partitioned_cookies

Таким образом, если страница в iframe получила параметры, которые делают ее допустимой, то та же страница, открытая вне iframe, будет в другом сеансе! Другой сеанс, в котором отсутствуют необходимые атрибуты, поэтому я могу четко показать ошибку на стороне сервера.

Опытный пользователь может легко обойти это, изменив свои файлы cookie. Для моего варианта использования этого достаточно, потому что это делает невозможным случайное событие.

После некоторых дальнейших поисков я обнаружил, что включить это довольно просто (если вы знаете, как это сделать):

На основании этого https://github.com/spring-projects/spring-framework/issues/31454#issuecomment-1905442337 Теперь у меня это есть в моем (котлин) коде, и у меня есть то, что я хотел.

@Bean
fun forceAllCookiesToBePartitioned(): TomcatContextCustomizer {
    val cookieProcessor = Rfc6265CookieProcessor()
    cookieProcessor.partitioned = true

    return TomcatContextCustomizer { context: Context ->
        context.usePartitioned = true
        context.cookieProcessor = cookieProcessor
    }
}

Самый простой вариант — поискать заголовок и значение запроса:

Sec-Fetch-Dest: iframe

Я протестировал это на последних версиях Chrome, Edge, Firefox и Safari, которые охватывают всю мою группу пользователей.

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