Надежное изменение размера iframe в разных источниках: iOS Safari удаляет postMessage при изменении ориентации устройств ⇐ Javascript

[Anonymous]

Я разрабатываю интерфейсную оболочку для интеграции сторонних демонстраций HTML5/WebGL в портал. Из-за строгих политик безопасности внешнее приложение запускается внутри iframe, размещенного в другом домене. Мне нужно, чтобы родительское окно динамически изменяло размер iframe на основе соотношения сторон внутреннего холста WebGL, когда пользователь поворачивает свое устройство.
Проблема: При первоначальной загрузке iframe базовые полезные данные postMessage (например, состояния загруженности, объема и баланса) прекрасно принимаются во всех браузерах. Вы можете проверить это поведение в моей промежуточной песочнице здесь: https://bullrushpokies.com/sandbox/iframe-resize-bug/ (Примечание: это невозможно воспроизвести в JSFiddle из-за пользовательских политик междоменной безопасности в CDN поставщика).
Однако при тестировании в iOS Safari с включенным параметром «Предотвратить межсайтовое отслеживание», если пользователь поворачивает устройство, определенные события изменения размера запускаемые канвой WebGL, либо сильно ограничиваются, либо полностью удаляются. Chrome на Android обрабатывает точно такой же поворот и без проблем получает полезную нагрузку изменения размера.
Вот логика прослушивателя родительского окна, работающая на этой странице:

Код: Выделить всё

window.addEventListener("message", (event) => {
// Basic validation
if (!event.origin.includes("konamigaming.online")) {
return;
}

try {
const payload = typeof event.data === 'string' ? JSON.parse(event.data) : event.data;

// These basic events arrive perfectly in Safari:
if (payload.event === "loaded") {
console.log("Game initialized");
}

// This specific event is completely dropped during iOS Safari orientation change:
if (payload.event === "CANVAS_RESIZE") {
const iframe = document.getElementById("game-frame");
iframe.style.height = `${payload.height}px`;
}
} catch (err) {
console.error("Parse error", err);
}

}, false);

Safari, похоже, обрабатывает внезапный всплеск событий postMessage во время изменения ориентации из iframe из разных источников как попытку отслеживания, если передаются данные о соотношении сторон.
Существует ли стандартный обходной путь для получения законных событий пользовательского интерфейса/изменения размера из изолированного iframe без запуска защиты от отслеживания Safari? Должен ли я установить двусторонний порт MessageChannel при инициализации вместо того, чтобы полагаться на базовый window.parent.postMessage?

Подробнее здесь: https://stackoverflow.com/questions/798 ... -device-or