У меня есть сайт, который курирует видео.Эти видео содержатся внутри iframe
с междоменным URL.Пользователь в основном взаимодействует с видео, которое загружается с некоторыми пользовательскими элементами управления, разработанными сторонним подрядчиком.
Учитывая, что у меня ограниченный доступ к этому междоменному серверу, я добавил некоторый код Javascript для прослушиванияза клики по полноэкранной кнопке.На данный момент моя работа состоит в том, чтобы полноэкранный элемент parent вместо элемента video
внутри iframe
.
В частности, наша страница выглядит примерно так:
<div class="iframe-root">
<video-chat/> <!-- Component with lots of children -->
<iframe frameborder="0">
</div>
Моя цель - полноэкранный элемент <div class="iframe-root">
, чтобы компонент <video-chat/>
также отображался в полноэкранном режиме.
До сих пор я пытался прослушивать щелчки на кнопке полноэкранного режима и публиковать сообщения.на window.parent
через window.parent.postMessage({action: "fullscreen"}, '*')
.Однако этот подход оказался неудачным, так как браузер блокирует полноэкранный запрос родителя с сообщением:
Failed to execute 'requestFullScreen' on 'Element': API can only be initiated by a user gesture
Возможно ли полноэкранное отображение элемента в родительском документе при клике, происходящем в междоменной областиiframe
?Если да, то как мне этого добиться?