WKWebView 中的嵌入式 YouTube 视频禁用全屏模式

Question

我正在尝试将 YouTube 视频嵌入到 WKWebView 中加载的网页中。

这是页面来源：

let html = """
<html><head>
<title>YouTube Video</title>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, shrink-to-fit=no, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

</head>
<body>
  Here is an embedded youtube video: <br/> 
  <iframe src="https://www.youtube.com/embed/oR-6N1Dc_zc?modestbranding=1&rel=0" frameborder="0" allowfullscreen></iframe> 
  <iframe src="https://player.vimeo.com/video/270611565" width="640" height="360" frameborder="0" allowfullscreen></iframe>
</body>
</html>
"""

WKWebView 的配置接近默认值（allowsInlineMediaPlayback 已启用）。网页加载 webView.loadHTMLString(html, baseURL: nil).

YouTube 播放器中的全屏模式按钮灰显。单击它时，会显示以下消息："Your browser does not support full screen.":

如果我改用 UIWebView，我会收到相同的消息。全屏模式似乎适用于嵌入的 Vimeo 视频（尽管 Vimeo 播放器似乎只是忽略了 iframe 的 allowfullscreen 属性）和使用 <video> 标签嵌入的视频。当我从 YouTube 网站加载视频时，全屏模式有效（尽管它看起来更像是某种模拟，而不是本机全屏模式）。

问题是：为什么全屏模式被禁用，有没有办法启用它？

Answer 1

您可以通过禁用内联媒体来解决此问题。

let webViewConfiguration = WKWebViewConfiguration()
webViewConfiguration.allowsInlineMediaPlayback = false
WKWebView(frame: .zero, configuration: webViewConfiguration)

WKWebView 中的嵌入式 YouTube 视频禁用全屏模式

Fullscreen mode is disabled for an embedded YouTube video in WKWebView

youtube

ios

wkwebview