pol*_*lau 6 mobile-safari ios html5-audio cache-manifest
我有一个小型的网络应用程序,只需点击几个按钮即可播放非常短的声音.它明确针对iOS(iPad)上的移动Safari.
在这里和其他地方阅读HTML5音频的几个"缺点"在这个背景下在移动Safari上尝试一些"黑客"和技巧后,我陷入了一种情况,Safari似乎只是(因为缺乏一个更好的词)破碎:
我可以在点击按钮A时播放声音A(它需要很长时间才能开始 - 我假设它正在下载[再次]？)之后,点击按钮B将立即再次播放声音A. 对于按钮C也是如此.在某些情况下,它会发出不同的声音,有时甚至是正确的声音.但主要是声音A.使用的格式是.aiff,现在是.m4a.
在自己编写了几个小版本之后,我决定使用Buzz库来处理声音加载/播放/等等.
有趣的是,他们的演示包括一个游戏,它几乎完全符合我的需要并触发相同的错误行为.我甚至最终处于这样一种情况:任何标签中的移动Safari中的任何音频播放器都会播放Buzz演示游戏中的特定声音(!).
我希望缓存清单可以帮助克服苹果预加载限制并强制应用程序在离线模式下按下按钮后立即播放声音.但在确认整个应用程序已被缓存后,我无法在离线模式下播放/听到任何声音.
有没有人设法得到这样的东西以某种方式工作？( - 看过Apple如何处理某些事情,我不希望有太多回应,但......)
更新1:
此答案中的示例会产生相同的效果:如何在iPad上使用HTML5/Javascript合成音频
更新2:
更新iOS(以及Safari)似乎解决了音频错误.但是,缓存清单似乎不会影响音频文件.这些文件根本不可用.
删除缓存清单后,应用程序工作正常,但将其添加到"主屏幕"并重新加载它也会阻止音频播放.
我希望我可以告诉你,有一个神奇的公式可以让你的所有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
祝好运!
| 归档时间： |
|
| 查看次数： |
4442 次 |
| 最近记录： |