HTML 视频在 iPhone 上不起作用答案

【问题标题】：HTML Video not working on iPhoneHTML 视频在 iPhone 上不起作用
【发布时间】：2018-08-29 21:24:02
【问题描述】：

所以我是开发新手，并且对 HTML 和 CSS 有基本的了解，我正在尝试编写我的个人网站，但我在 iPhone 上处理视频时遇到了问题（它在其他手机上运行良好）。

我认为这是因为我正在使用自动播放功能，但我不想破坏我网站的桌面体验。是否可以在桌面上保持自动播放，而在 iOS 上仍然有一定容量的视频？

<div class="image1">
<video  autoplay="true" controls="true" autoplay loop class="video">
    <source src="assets/tbgv.mp4" type="video/webm">
    <source src="assets/tbgv.mov" type="video/mov">
    <source src="assets/tbgv.ogv" type="video/ogg">
</video>

【问题讨论】：

第一个视频的类型是video/mp4不是webm，并且.mov不是原生html5视频类型

标签： html css iphone video html5-video

【解决方案1】：

在 iOS 和 Mac 上确实存在一些自动播放功能限制。但是您可以通过 JavaScript 承诺构造通知视频是否被拒绝，并据此更改其行为。

你可以这样使用：

var promise = document.querySelector('video').play();

if (promise !== undefined) {
    promise.catch(error => {
        // Auto-play was prevented
        // Show a UI element to let the user manually start playback
    }).then(() => {
        // Auto-play started
    });
}

有关更多详细信息，请查看这篇文章： https://webkit.org/blog/6784/new-video-policies-for-ios/

【讨论】：