如何在移动设备上更改 HTML5 视频的播放速度？答案

【问题标题】：How to change the playing speed of videos in HTML5 on mobile?如何在移动设备上更改 HTML5 视频的播放速度？
【发布时间】：2016-05-25 03:35:54
【问题描述】：

根据this site，这在playbackRate 和defaultPlaybackRate 属性中得到支持，可通过DOM 访问。但这不适用于移动设备。示例：

<!DOCTYPE html>

<video id="my-video" src="chubby-bubbies.ogv" ...></video>

<script type="text/javascript">
  /* play video twice as fast */
  document.getElementById("my-video").defaultPlaybackRate = 2.0;
  document.getElementById("my-video").play();

  /* now play three times as fast just for the heck of it */
  document.getElementById("my-video").playbackRate = 3.0;
</script>

以上内容适用于 Chrome，也适用于桌面版 Firefox 20 and above。

【问题讨论】：

我认为这与移动端 html 视频的限制有关。在用户点击播放视频之前，您无法控制视频元素。您不能通过 JS 强制视频开始播放。

标签： javascript android html mobile

【解决方案1】：

答案很简单，移动 Chrome (Android) 不支持播放速率更改，即使该网站表示支持：https://developer.mozilla.org/en/docs/Web/API/HTMLMediaElement#AutoCompatibilityTable

这是移动端播放速率变化支持的真实浏览器：

Chrome 20+ ✔
火狐 20+ ✔
IE 9+ ✔
Safari 6+ ✔
Opera 15+ ✔
移动 Chrome (Android) ✖
移动 Firefox 24+ ✔
IE 移动 ✖
移动版 Safari 6+ (iOS) ✔
Opera 手机 ✖

我创建了一个网站并通过首先将以下内容添加到 web.config 文件来对其进行测试：

<system.webServer>
    <staticContent>
           <mimeMap fileExtension=".mp4" mimeType="video/mp4"/>
    </staticContent>
</system.webServer>

然后我将一个简单的视频上传到我的网站并上传到 Azure 以在不同的浏览器中进行测试：http://pandasneezy.azurewebsites.net/

我建议您使用 Mobile Firefox 24+，它应该可以正常工作： document.getElementById("my-video").playbackRate = 3.0;

【讨论】：

在 firefox HTML5 视频播放速率有效。知道如何调整 youtube 嵌入式视频的播放速率。我尝试使用 youtube 的 javascript API，但它不适用于 firefox 和 chrome。
看看这个：stackoverflow.com/questions/22604934/…
我查过了。 player.setPlaybackRate(2); 不适用于移动 chrome/firefox。它仍然以 1 倍的速度播放
Mobile Firefox 24+ ✔ 应该是 ✖ 那么？
是的，Mobile Firefox 24+ 是 ✖ 移动版。