77

我已经创建了一个HTML5视频播放器（非常简单），可以在iPad和浏览器上完美运行。

但是，当我在iPhone上打开它时，只有一个播放按钮，当按下该按钮时，会在所有内容的顶部在新窗口中打开本机视频播放器。

这意味着我无法访问自定义控件和时间跟踪（用Java语言编写），因为视频现在是独立运行的。

有什么方法可以覆盖Apple在iPhone上对HTML5视频的控制，并使它像在iPad上一样工作？

干杯

— 安德烈
source

从技术上讲您无法做到，但是有一些可用的库可以使之成为可能，例如iphone-inline-video（披露：我写过）

— fregante

104

对，

我对此一无所获，并向苹果公司提交了错误报告。

几周后，他们回到我身边，很简单地说，我应该在HTML的视频标签上添加“ webkit-playsinline”，并在UIWebView上添加“ allowsInlineMediaPlayback”属性。

因此，最终结果如下所示：

的HTML

<video id="player" width="480" height="320" webkit-playsinline>

对象

webview.allowsInlineMediaPlayback = YES;

和所有的工作都很好:)

希望这对某人有所帮助，因为它实际上是未记录的文档，我唯一可以找到“ webkit-playsinline”参考的地方是在iAds参考中，它说：“仅iAds JS”。

— 安德烈
source

26

我只是想澄清您的答案...如果您正在开发仅基于Web的解决方案（在这种情况下，UIWebView不会起作用），那么这将不起作用，对吗？

— natlee75

8

@Andre：能否请您帮我解释一下，如何在纯HTML5网页上使用obj-c？我想在我的html5网站的视频播放器中在iPhone上内联播放视频。

— Hiral Vadodaria'6

9

如果您使用的是Phonegap / Cordova，则可以<preference name="AllowInlineMediaPlayback" value="true" />在config.xml文件中启用内联媒体播放功能，并将webkit-playsinline添加到<video>标签中

— micho

2

谢谢！我多年来一直在寻找此信息。

— Paul

2

@Andre它仍然可以在UIWebView中工作。我最近在一个应用程序中尝试过它，所以我知道。是我的错，我误解了OP的问题，并认为他正在尝试在移动Safari（而不是UIWebView）中执行此操作，这是我目前正在寻找的解决方案。早在2011年，我就可以使用自定义视频控件在Safari中内嵌播放视频，但现在不再起作用。

— Paul

11

在iOS Safari实现内嵌视频支持之前，您需要使用网络支持的语言编写视频解码器。有视频解码器，如现有实现百老汇的H.264（视频），jsmpeg为MPEG1，和ogv.js（视频和声音的支持）。

请记住，解码视频的过程在计算上很繁琐。预期FPS相对较慢（±20）。

作为参考，这些家伙准备了一个视频演示，您可以在iOS设备上播放该视频。

— 加朱斯
source

4

在iOS 10+中

Appleplaysinline在iOS 10的所有浏览器中启用了该属性，因此可以无缝运行：

<video src="file.mp4" playsinline>

在iOS 8和iOS 9中

您可以通过略读视频而不是实际播放视频来模拟回放，从而解决此问题.play()。

您可以使用iphone-inline-video来处理播放和音频同步（如果有），并保持<video>应有的工作。

— 弗雷坎特
source

1

您是否创建了一个应用程序，或者这是用于移动Safari的应用程序？如果您有一个应用程序并使用UIWebView，则应设置UIWebView的allowInlineMediaPlayback属性。

— 拉尔斯·JK
source

我有一个UIWebView包装器！这听起来像是救命稻草，但只能成功。我收到了JS事件（提示点），但是由于某些原因，它仍在使用自己的视频控件全屏运行：/

— Andre

4

我正在尝试达到相同的目的，但是对于移动设备的野生动物园（因此没有UIWebView）。你有什么暗示吗？

— Cystack

对不起，不是真的。一年多以前，我一直在看这个东西，此后再也没有看过。祝你好运！

— 安德烈（Andre）

1

在iOS 10中，向HTML5视频标签添加“ playsinline”属性不会阻止在iPhone UIWebview上全屏播放，直到我还添加了“ controls”属性。这就是我的工作方式：

<video width="100%" height="240" controls playsinline>
      <source src="movie.mp4" type="video/mp4" >
</video>

当然，_webView.allowsInlineMediaPlayback=YES;在ViewController中也可以使用。

— 萨斯旺布
source

0

有一些解决方法，我正在使用一个库来自动启用此功能。但是，直到Apple将Safari设置为

webview.allowsInlineMediaPlayback = YES;

那么我们将不得不使用骇客来实现相同的行为。

您可以在以下位置检查该项目：https : //github.com/newshorts/InlineVideo以查看它是否满足您的需求。

— 短裤
source

0

只需将以下内容添加到您的config.xml中： <preference name="AllowInlineMediaPlayback" value="true" /> 否则，UIWebView将忽略webkit-playsinline属性。

— 天堂
source

-1

您可以通过将其添加到config.xml中来轻松地允许它：UIWebView然后应该遵守webkit-playsinline属性。

— 天堂
source

iPhone与iPad /浏览器上的HTML5嵌入式视频

在iOS 10+中

在iOS 8和iOS 9中