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

Posted 2023-02-24

【中文标题】强制 iOS iPhone youtube 嵌入播放器退出全屏

【英文标题】：Force iOS iPhone youtube embed player out of fullscreen

【发布时间】：2016-03-19 13:33:42

【问题描述】：

我正在创建一个网站，用户可以在其中观看视频，并在此过程中回答问题。但是，我有一个问题。当用户在 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

【问题讨论】：

您是否有权访问视频元素，或者您正在使用 iframe？

我正在使用一个

知道了。对不起，伙计，我想你可能被卡住了。

iOS (caniuse.com/#feat=fullscreen) 不支持全屏，因此您尝试退出的不是全屏。我很好奇为什么这可以在 iPad 上工作，当它处于全屏模式时，它对视频也一样。

我猜这可能是因为在 iPad 上，浏览器被告知要进入全屏模式，所以它可以在启动原生播放器之前设置一个标志“某事是全屏”。而在 iPhone 上，开始播放会跳过浏览器中的“启用全屏”步骤..

【参考方案1】：

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

当你想退出 iPhone 播放器时：

player.seekTo(2000, true);

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

【讨论】：

在 iOS 中退出全屏的最佳解决方法。谢谢！

【参考方案2】：

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

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

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

【讨论】：

你有关于这个“苹果自己的视频播放器”的文档吗？它可以处理所有 html5 视频嵌入吗？

【参考方案3】：

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

【参考方案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 应用程序并返回到网络浏览器。为了防止移动浏览器直接带你到本机应用程序。你可以去你的手机设置并更改默认启动应用程序。）

希望对您有所帮助。

【讨论】：

这就是问题所在。您不能强制播放器退出全屏或关闭它。你有解决方案吗？谢谢！

用户没有点击任何按钮。这就是我想说的。相反，我需要将播放器拉出全屏。你是说我需要寻找到视频的结尾？我该怎么办？谢谢！