强制 iOS iPhone youtube 嵌入播放器退出全屏

Question

我正在创建一个网站，用户可以在其中观看视频，并在此过程中回答问题。但是，我有一个问题。当用户在 iPhone 上观看 YouTube 嵌入视频时，它会在 iOS 播放器中启动，而不是在 YouTube 播放器中启动。当我试图让播放器退出全屏时，它没有这样做，而是暂停视频并坐在那里。我正在使用此代码：

if (
    document.fullscreenElement ||
    document.webkitFullscreenElement ||
    document.mozFullScreenElement ||
    document.msFullscreenElement
) {
    // exit full-screen
    if (document.exitFullscreen) {
        document.exitFullscreen();
    } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
    } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    } else if (document.msExitFullscreen) {
        document.msExitFullscreen();
    }
}

这适用于除 iOS iPhone 播放器之外的所有设备。我也尝试过隐藏播放器，但这也不起作用。有没有办法让播放器退出全屏，或者某种解决方法？谢谢！

注意：我使用的是 Youtube iframe API。 https://developers.google.com/youtube/iframe_api_reference?hl=en

Answer 1

我使用以下代码作为解决方法：

当你想退出 iPhone 播放器时：

player.seekTo(2000, true);

这将使播放器转到视频的结尾并关闭全屏播放器。

Answer 2

在苹果自己的视频播放器中播放 Iphone 视频。该播放器不像 YouTube 播放器那样是 html5 元素。 因此，iPhone 上的全屏中没有元素。

在 Ipad 上不是这种情况，YouTube 自己的播放器会启动，启用全屏模式。

简而言之：我很确定你不能这样做。 （很高兴被证明是错误的）

Answer 3

这是不可能的。要么将其切换到 YouTube 应用，要么在应用内使用 iOS 默认播放器。

Answer 4

如果您仍在使用移动浏览器，您可以尝试以下操作：

在 youtube api 中，有一个

YouTube.PlayerState.ENDED

事件。当用户点击退出全屏模式时触发此事件。 只需在您当前的 html 页面中添加编码以强制浏览器关闭播放器以关闭全屏，它就会重新显示原始播放器。

有一个问题，在 Playerstate.ENDED 事件之后视频将不会继续播放。 但是您可以随时重新定位视频停止的时间并重新播放。

function takePlayerOutFullscreen(event) {

     if (event.data == YT.PlayerState.ENDED) {
         alert("video ended");

     }
     else if (event.data == YT.PlayerState.PAUSED) {
          alert("video paused");
     }
 }

（注意：如果您的移动浏览器在播放视频时直接将您带到本机 youtube 应用程序，那么您无法切换/关闭本机 youtube 应用程序并返回到网络浏览器。为了防止移动浏览器直接带你到本机应用程序。你可以去你的手机设置并更改默认启动应用程序。）

希望对您有所帮助。