Safari/iOS 上的 HTML5 音频回调失败答案

【问题标题】：HTML5 Audio callback fails on safari/iOSSafari/iOS 上的 HTML5 音频回调失败
【发布时间】：2012-06-14 16:26:12
【问题描述】：

我已经构建了一个应用程序，旨在通过使用“结束”事件在第一个声音结束时播放每个声音。

在我的初始版本中，每个声音都有自己的音频元素，结果如下：

   function play_next_audio(){
        speaker = $('audio#' + sounds[i++]).get(0);
        speaker.addEventListener('ended',play_next_audio);
        speaker.play();
   }

这适用于所有桌面浏览器，包括 Safari，但不会超出 iOS 上的第一个字母。

我还尝试了一种不同的方法 - 一个单独的音频元素依次加载每个声音。在那里，我尝试绑定“结束”事件以及首先加载并绑定“canplaythrough”事件。在这两种情况下，即使在桌面 Safari 上也无法正常工作 - 这次成功播放了前两个字母。

这里是孤立的测试：

http://dev.connectfu.com:42001/app/test-sounds.html

请注意，audio.load() 被注释掉了几个地方 - 输入或输出似乎没有区别。

我做错了什么？如何在 iOS 上播放一系列声音？非常感谢您的帮助！

【问题讨论】：

我的回答对您有帮助吗？如果是，请标记为已接受的答案。谢谢！

标签： ios html mobile jquery-mobile html5-audio

【解决方案1】：

我不相信 iOS 中的音频或视频支持 .play() 方法。 Apple 不喜欢在访问页面时自动播放视频或音频的想法。

以下是有关跨平台 HTML5 音频支持状态的有用读物：http://www.phoboslab.org/log/2011/03/the-state-of-html5-audio

【讨论】：

关闭。 .play() 没有问题 - .load() 是个问题。还在做研究。 :-)
正如下面提到的 Judah，没有用户交互就无法调用 .play。
此外，当页面不在最前面时，Apple 会暂停 JavaScript 的执行。因此，如果您切换应用程序或切换标签页或关闭屏幕或让屏幕休眠，您将无法调用 .play()。

【解决方案2】：

更新自 2017 年起，在 iOS 上的 Safari（或 Chrome）上，在多种情况下，结束事件都不会触发。更多信息可以在这里找到：It's almost 2017, and HTML5 audio is still broken on iOS。

我已经构建了一个 HTML5 音频播放器 (Chavah Messianic Radio)，它可以在 iOS 上的 Safari 上“工作”。

我所说的“作品”是指它在 Apple 残缺的 iOS

这是我的发现：

Apple 不允许您在用户交互之前对任何音频调用 .play。 对我来说，这意味着检测 iOS，然后将音乐显示为暂停，直到用户单击播放。他们的理由是这会消耗数据和电池；但在实践中，它只会削弱网络应用程序并扼杀网络的发展。
如果要播放连续的声音（一个接一个），请使用单个元素。 当需要播放下一个声音时，设置 existingAudio.src，然后调用 existingAudio.load()，然后调用 existingAudio 。玩（）。这将允许您播放连续的声音。
如果 Safari 在后台，则不会触发音频事件。。如果用户切换到不同的应用程序，音频将继续播放，但不会触发 .ended 事件。这意味着几乎不可能构建音乐播放器应用。

希望这会有所帮助。

rant>

同时：Apple，拜托，拜托，请在 iOS Safari 中为我们提供更好的 HTML5 支持。这是你的行动项目，Apple：

让 HTML5 音频在后台运行。
支持OGG。
支持预加载音频。
支持并发音频。
让我们在没有用户交互的情况下播放音频。

做这些事情吧，Apple，你将成为移动 HTML5 音频的行业领导者，每个人都会效仿你，你将再次处于领先地位，网络应用程序将在你的平台上完美运行，同时会被削弱其他移动平台。是的，这些功能将使用数据和电池，但本机应用程序已经这样做了。停止破坏网络应用程序并成为领导者。 让 HTML5

【讨论】：