HTML5 音频行为答案

【问题标题】：HTML5 Audio behaviorHTML5 音频行为
【发布时间】：2012-06-14 14:59:35
【问题描述】：

我在 HTML5 页面中有一个音频元素。我开始播放音频，然后暂停。之后，我通过按主页按钮返回主屏幕并拨打电话。通话结束时，音频元素会自动恢复。这发生在 Android 4.0.3

问题在于，这不是预期和期望的行为。不幸的是，当浏览器在后台运行时，不会引发 javascript 事件，我无法使用 Javascript 捕获和阻止这种行为。

感谢任何帮助。提前致谢。

【问题讨论】：

你在安卓上使用什么浏览器？
实际上这是期望的行为，它甚至发生在基于诺基亚 symbian 的基本手机上，假设您听一首歌，中间接到一个电话，然后歌曲从您离开的地方继续播放，这些设备甚至不支持多任务处理，但这个功能无处不在。
是的，但我已经暂停了音频。如果它自己自动启动，它不应该是预期的行为
果冻豆上也有错误。似乎是一个浏览器错误，它基本上调用本机 onPause 和 resume 事件来处理 HTML5 音频会话的用户暂停。我想一个很好的处理方法是不暂停音频，而是在用户暂停音频时终止会话。存储音频暂停和终止的值。然后在播放时使用自定义事件从该时刻重新启动音频。我不知道你怎么能做这样的事情，但这是我最好的猜测！ HTH
好的，问题没有出现在 chrome 中。所以这是默认的android浏览器问题.. HTH

标签： javascript android html webkit html5-audio

【解决方案1】：

我没有 ICS 手机可以试用，但我会这样做：

pause 显然会跟踪音频时间位置。 4.0 似乎会自动恢复您暂停音频文件的位置

因此，您可以stop 您的音频文件，而不是暂停。很遗憾，HTML5 不支持stop。

你有一个棘手的解决方案：

pause音频
存储位置：trackPos = myTrack.currentTime;
存储量：trackVol = myTrack.volume;
静音：myTrack.volume = 0;

然后当用户返回并再次点击播放时：

如果 trackPos 存在

设置起始位置为trackPos：myTrack.currentTime = trackPos;
play
mytrack.volume = trackVol;
delete window.trackPos;

这很棘手，但如果您使用 JavaScript 控件，它应该可以工作。

如果您使用本机控件，则播放和暂停将由浏览器界面管理。然后你应该只存储位置并开始变得真正的脏：

删除来源：

myTrack.removeChid(yourSRCs)
恢复您的 SRC 和焦点位置
等待用户播放

这是一个快速而肮脏的草稿，未经测试。但它应该工作

///编辑///

一个有效的 Javascript 演示，至少在我的桌面上。在您的 ICS 上试用： JSFiddle

（保存文件，我猜你无法在手机上正常启动 jsfiddle）

【讨论】：

理论上这一切都是有道理的，但我尝试做这样的事情，它只是恢复并继续播放至少 30 秒。我没有尝试将音量设置为零。但是我确实将 audio src 和 audio 设置为 null，这应该完全清除它！我想相信，但不幸的是，我真的需要看到一个有效的演示才能这样做。
如果您可以使用 JavaScript 控件，我可以为您设置一个快速演示
感谢演示。但是，它不适用于 Android 浏览器。播放未开始。
@mahemoff 实际上它不适用于我的 ICS 平板电脑。我发现这是因为我从 jPlayer 的服务器热链接了音频。我尝试使用托管在我身上的文件，但它播放没有问题。因此，如果您用文件替换音频，播放应该可以正常工作。
就我而言，我正在流式传输第 3 方内容。

【解决方案2】：

在脚本块中尝试以下操作。它应该可以工作。

var ppAudio = function(event){
    var ppMethod = (event.type == "blur")? "pause" : "play",
        audio = document.getElementsByTagName("audio"),
        l = audio.length;
    for (;l--;) audio[l][ppMethod]();
};

// window.onfocus = ppAudio;
window.onblur = ppAudio;

我想你不需要 onfocus 事件。但是，这里是切换的示例。

【讨论】：

我看到的问题是伪劣的Android浏览器实现的实际问题。除非这段代码在 Android 浏览器上测试过，否则它不太可能工作。
同意 -- 音频 API（和视频）在 Android 浏览器上不是很好。我不确定切换到不同的应用程序是否会触发模糊事件，但我编写的代码是基于标准的，并且可以在大多数浏览器上运行。

【解决方案3】：

也许您可以声明一个布尔值来跟踪您是否手动暂停，这样您就可以在焦点或其他适当的事件上对其进行评估。

【讨论】：

【解决方案4】：

您是否尝试过从 DOM 中移除音频对象并在播放时恢复它？

【讨论】：

【解决方案5】：

我将使用布尔开关附加一个“onFocus”事件以确定音频播放器的先前状态，如果您以先前的“暂停”状态获得焦点，则停止播放器，否则播放它。

【讨论】：