你能在iPad上自动播放HTML5视频吗?

<video>标签autoplay="autoplay"属性在Safari中正常工作。

在iPad上测试时,视频必须手动激活。

我认为这是一个加载问题,所以我跑了一个循环来检查媒体的状态:

videoPlay: function(){
    var me = this;
    console.log('STATE: ' + $("#periscopevideo").get(0).readyState);
    if ($("#periscopevideo").get(0).readyState != 4){
      setTimeout(function(){me.videoPlay();}, 300);
    }
    else {
      $("#periscopevideo").get(0).play();
    }
}

iPad上的状态保持在0 。 在我的桌面Safari浏览器,它通过01 ,最后4 。 在iPad上,如果我手动点击“播放”箭头,它只会达到4

此外,通过onClick调用$("#periscopevideo").get(0).play()也能起作用。

Apple在自动播放方面有任何限制吗? (我正在运行iOS 5+)。


iOS 10更新

禁止自动播放已从iOS 10中解除 - 但有一些限制(例如,如果没有音轨,则可以自动播放A)。

要查看这些限制的完整列表,请参阅官方文档:https://webkit.org/blog/6784/new-video-policies-for-ios/

iOS 9和之前

从iOS 6.1开始, 不再可以在iPad上自动播放视频。

我对他们为什么禁用自动播放功能的假设?

那么,尽管许多设备所有者在其设备上都有数据使用/带宽限制,但我认为苹果觉得用户应该自行决定何时启动带宽使用。


经过一番研究后,我在苹果文档中找到了以下关于在iOS设备上自动播放的提取以确认我的假设:

“苹果已经决定通过脚本和属性实现禁用iOS设备上的视频自动播放。

在Safari中,在iOS上(对于包括iPad在内的所有设备),用户可能位于蜂窝网络并按数据单元收费,则预先加载和自动播放将被禁用。 直到用户启动它才会加载数据。 “ - Apple文档。

以下是Safari HTML5参考页面上的一个单独警告,其中介绍了为什么嵌入式媒体无法在iOS上的Safari中播放:

警告 :为防止蜂窝网络主动提供下载,费用由用户承担,嵌入式媒体无法在iOS上的Safari中自动播放 - 用户始终会启动播放。 一旦启动播放,控制器会在iPhone或iPod touch上自动提供,但对于iPad,您必须设置控件属性或使用JavaScript提供控制器。


这意味着(就代码而言),除非用户操作(例如单击事件)触发play()load()方法,否则在用户启动播放之前,Javascript的play()load()方法处于非活动状态。

基本上,用户启动的播放按钮可以工作,但onLoad="play()"事件不会。

例如,这将播放电影:

<input type="button" value="Play" onclick="document.myMovie.play()">

尽管以下内容在iOS上不会做任何事情:

<body onload="document.myMovie.play()">

我想首先说我意识到这个问题很老,而且已经有了一个可以接受的答案; 但是,作为一个不幸的互联网用户,他使用这个问题作为一种手段,只是在不久之后被证明是错误的(但不会让我的客户感到不安),我想补充一下我的想法和建议。

虽然@ DSG和@Giona是正确的,并且他们的答案没有问题,但您可以使用创造性机制来“绕过”,可以这么说,这种限制。 这并不是说我纵容规避这个功能,恰恰相反,但只是一些机制,使用户仍然“感觉”,就好像一个视频或音频文件是“自动播放”。

快速的解决方法是在移动页面的某个地方隐藏一个视频标签,因为我建立了一个响应网站,我只为小屏幕做这个。 视频标签(HTML和jQuery示例):

HTML

<video id="dummyVideo" src="" preload="none" width="1" height="2"></video>

jQuery的

var $dummyVideo = $("<video />", {
  id: "dummyVideo",
  src: "",
  preload: "none",
  width: "1",
  height: "2"
});

通过隐藏在页面上,当用户“点击”观看电影(仍然是用户交互,无法绕过该需求),而不是导航到辅助观看页面,我加载隐藏的视频。 这主要是因为媒体标签没有被真正使用,而是被提升为Quicktime实例,因此完全不需要具有可见的视频元素。 在“点击”的处理程序中(或在手机上的“touchend”)。

$(".movie-container").on("click", function() {
  var url = $(this).data("stream-url");
  $dummyVideo.attr("src", url);
  $dummyVideo.get(0).load(); // required if src changed after page load
  $dummyVideo.get(0).play();
});

和中提琴。 就用户体验而言,用户点击要播放的视频,Quicktime会打开播放他们选择的视频。 这仍然在视频只能通过用户操作进行播放的限制之内,所以我不会强制任何人决定使用此服务观看视频。 当我试图找出Youtube是如何将他们的手机取而代之的时候,我发现了这一点,这本质上是一些非常好的Javascript页面构建和隐藏在视频标签中的花哨元素。

tl; dr在iOS设备上尝试创建“自动播放”用户体验功能的方法有些“解决方法”,但不会超出Apple的限制范围,并且仍然让用户决定是否要观看视频(或音频最类似,但我没有经过测试)自己没有一个没有他们的许可只是加载。

另外,对于那些评论说来自sleep.fm的人来说,这仍然不能解决您的问题,即基于时间的音频播放。

我希望有人发现这些信息很有用,它会为我节省一周的坏消息传递给一位客户,他坚信他们有这个功能,我很高兴找到一种方法来最终提供它。

编辑

进一步发现表明上述解决方法仅适用于iPhone / iPod设备。 iPad在完全屏蔽之前,会在Safari中播放视频,因此您需要一些机制在播放前重新调整视频的大小,否则最终会出现音频和视频。


刚刚设置

webView.mediaPlaybackRequiresUserAction = NO;

自动播放适用于iOS。

链接地址: http://www.djcxy.com/p/71137.html

上一篇: Can you autoplay HTML5 videos on the iPad?

下一篇: What does the param mean in SAEF?