html 视频 javascript 播放方法在移动版 Safari 中不起作用

Question

我的 ember.js 应用程序中有一个视频元素，我设置 src 和 window.URL.createObjectURL(file) 以在上传前生成预览。从视频文件输入中捕获后，呈现的 html 如下所示：

<video class="video-review" controls="1" autoplay="1"
  src="blob:http://66efcd0.ngrok.com/bb427ce0-af04-4763-bb59-3be85b936895">
</video>
// * ngrok is just a port forwarding util for testing

视频显示正常，如果我手动点击它也可以正常播放。

我需要视频在加载后立即播放。 问题是自动播放不起作用，我无法从 javascript 播放视频。 在控制台中（视频加载后 vid.load()）我尝试过：

vid = $('video.video-review').get(0)
vid.play()

这不起作用。但是，如果我手动点击视频并播放它（并给它焦点），那么从控制台调用 vid.play() 确实可以正常播放视频。所以我试着给视频焦点：

vid.focus() and jquery $(vid).focus()
vid.play()

运气不好。

如何获取 HTML 视频以在移动版 Safari 中与 javascript 一起播放？？ - 为什么自动播放不起作用？

这里还有分配视频属性的代码（由观察者在文件更改事件中触发）：

var file = this.get('file');
window.URL = window.URL || window.webkitURL;
var vid = this.$('.video-review').get(0);
vid.src = window.URL.createObjectURL(file);   
vid.file = file;
vid.addEventListener('canplaythrough', function() {
  this.play();
}, false);
vid.load();

Answer 1

你不能。只有在响应用户操作时调用视频播放才有效，例如在点击事件处理程序中。这是设计使然。

Can you autoplay HTML5 videos on the iPad?

html 视频 javascript 播放方法在移动版 Safari 中不起作用

html video javascript play method not working in mobile Safari

javascript

safari

html5-video

ios