我有一个小型网络应用程序，只需单击几个按钮即可播放非常短的声音位。它明确针对iOS（iPad）上的移动Safari。
在这里和其他地方读到关于HTML5音频在移动Safari上的几个“缺点”并尝试了一些“黑客”和技巧之后，我陷入了Safari看似简单的情况（由于缺乏更好的词）破碎：
我可以在点击按钮A时播放声音A（它需要很长时间才能启动 - 我假设它正在下载[再次]？）之后，点击按钮B将立即播放声音A再次。对于按钮C也是如此。在某些情况下，它会发出不同的声音，有时甚至是正确的声音。但主要是声音A.使用的格式是.aiff，现在是.m4a。
自己编写了几个小版本之后，我决定选择Buzz库来处理声音加载/播放/等等。
有趣的是，他们的演示包括一个游戏，它完全符合我的需要和触发相同的错误行为。我甚至最终处于任何标签中的移动Safari中的任何音频播放器都会在Buzz演示游戏（！）中播放某种声音的情况。
我希望缓存清单可以帮助克服Apples预加载限制并强制应用在离线模式下按下按钮后立即播放声音。但在确认整个应用程序已被缓存后，我无法在离线模式下播放/听到任何声音。
有没有人设法得到这样的东西以某种方式工作？（ - 看过Apple如何处理某些事情，我不希望有太多回应，但是......）
更新1：
此答案中的示例会产生相同的效果：How to synthesize audio using HTML5/Javascript on iPad
更新2：
更新iOS（以及Safari）似乎解决了音频错误。但是，缓存清单似乎不会影响音频文件。这些文件根本不可用。
删除缓存清单后，应用程序正常运行，但将其添加到“主屏幕”并重新加载它会阻止音频播放。
答案 0 :(得分：8)
我希望我能告诉你，有一个神奇的公式可以让你的所有html5媒体完美地运作，但事实并非如此。 HTML5音频/视频的移动支持现在很差;远远超过其桌面前身。更糟糕的是，每个不同的平台都以不同的方式处理它，并且大多数平台仅在半新版本中支持它。
但是，您可以使用一些技巧让媒体文件在移动版Safari中正常运行。为了解释它们，你需要了解它的一些缺点。
1）您无法加载多个音频/视频文件
根据我的经验，浏览器一次只能加载一个文件。如果您播放一个文件，请继续播放另一个文件，然后返回，它将再次加载该文件。而且，虽然我自己没有尝试过，但我不相信缓存清单会帮助你。
我要做的就是将所有音频文件合并为一个大型音频文件。然后，根据请求的音轨，我将播放位置移动到适当的起始位置并播放该音轨。然后，我将使用setInterval每隔几毫秒检查一次播放，以确定当前播放位置是否到达轨道末尾。一旦它发生了，我就暂停了。 Pluis，我在每个音轨之间给了自己几秒钟（2-3），以防万一手机的CPU负载很重，并且检查了一点太晚了。
2）您无法自动播放音频/视频文件
Apple在其HTML5媒体标记技术中内置了这些曲目只会加载和播放以响应用户点击事件的限制。这样，当你去他们的网站时，开发人员就无法自动播放烦人的曲目。
当我使用音频/视频标签时，我正在尝试制作富媒体广告。所以当我点击横幅并展开广告时，我将我的音频/曲目加载到横幅点击事件。
我建议你应该做的是打开一个小灯箱弹出窗口，询问用户是否要打开/关闭声音。无论用户是打开还是关闭声音，您都可以将加载功能附加到该弹出框的单击事件中。
就个人而言，我使用load（）函数没有太多运气。我运行该功能来加载音频，然后单击播放，它只会再次加载它。可能一直以来我只是做得不对，所以请随意证明我是错的并让它发挥作用。我告诉轨道要播放的是什么，所以它会开始加载，然后我会使用setInterval来查看当前播放时间是否仅增加了几毫秒。一旦我注意到它开始播放曲目，我会立即暂停它。
3）仅在iOS 4.0及更高版本中支持音频/视频标签
没有办法解决这个问题。这只是事实。
以下是一些在我开发音频/视频标签时有所帮助的网站：
http://www.w3.org/wiki/HTML/Elements/video
http://dev.w3.org/html5/spec-author-view/video.html#media-elements