3.8　HTML5的<audio>标签并不尽如人意

用HTML5与JavaScript来处理音频本该是件容易的事情。在理想状况下，播放声音应该如同绘制图像一般简单，只需调用audiocontext.play(noteOrFrequency)之类的API即可；无论浏览器版本新旧，无论是在移动平台还是桌面操作系统，都要能正常播放声音文件才对，即便是手机自带的浏览器也应如此；用户应该很容易就能通过网页来谱曲、混编音乐（mix beat），或弹奏乐器，并且能在网页这种新颖的作曲环境下展示自己的音乐天赋，享受其中乐趣。而对于本章来说，理想状况应该是：可以加入一些已经获得使用授权的曲目，再多绘制一些图像、多设计一些关卡，并使计分系统更加精确，这样就能打造一款类似《Rock Band》的游戏了。

在写作本书时，上述这些想法还都没有实现。对于应该支持何种音频编码/解码器（codec）这一问题，各浏览器阵营看法不同，分歧主要集中在应该使用开源技术还是闭源技术上面，也就是说，如果想在网页中播放音频文件，那么得准备两个版本（一个是.ogg格式，另一个是.mp3格式）。除了如何播放声音之外，各浏览器对于如何在底层创建声音这个问题，也未能达成一致看法。Mozilla近期曾致力于一套名为Audio API Extension的方案，可是现在已经废弃了。而Chrome则支持Web Audio标准，W3C正在开发这套API（可参考http://www.w3.org/TR/webaudio/）。Firefox也宣称将来会遵循此标准，不过在笔者写作本书时，还没有哪一套API能同时为Chrome及Firefox浏览器所支持。

除了刚才谈到的这些，还有其他问题。比如，在移动设备上加载多个声音文件，可能会使游戏崩溃。另外，如果想查询浏览器是否支持某种声音格式，那结果也会令你失望。看看程序清单3.21这段代码。

程序清单3.21　查询浏览器是否能播放某种格式的音频文件

上面这段特征检测代码有问题。我们在myAudio这种HTMLMediaElement对象上面调用canPlayType函数，本来是想获得true或false这样的明确回答，可浏览器所返回的值却比较模糊，有点像毕业舞会受邀者的口气，而不太像个计算机程序。这三种返回值是："probably"（很可能）、"maybe"（也许）和" " 。

笔者最后想说，浏览器对音频文件的支持度应该会越来越好才对。但愿如此吧，不过这也很难预测。过去几年里，各浏览器对音频文件的支持方式变化很大，而且现在仍未稳定下来。

提示

别泄气，笔者在本节只是想解释浏览器播放音频文件时的一些底层问题而已，虽然困难颇多，但是希望仍在。看看附录C吧，你会发现有人在音频文件播放这一领域颇有成就。对HTML5技术来说，跨浏览器绘制图形基本上已经没有障碍了，但是跨浏览器播放音频仍是个大问题。

有一些封装程度较高的工具，可用来加载音乐及音效文件。但是请记住，在采用这些工具来处理音频时，如果浏览器不支持相关格式，那么就意味着需要使用flash来作为备援技术。而且还要知道，这并不能解决动态生成音频文件的问题。

如果想根据本章的打地鼠游戏来制作《Rock Band》风格的作品，那么在处理音频播放这个问题上，有两种办法。一种办法是采用Firefox或Chrome浏览器各自所提供的底层API，动态地播放声音，还有一种办法是采用预先准备好的音频文件。若采用后一种办法，则需要设法创建音频文件（或是在取得授权的情况下使用他人所制作的音频文件），并把这些短暂的声音片段与对应的按钮关联起来，以便在适当的时机播放。笔者想把本书的范例代码写得更易扩展、适用面更广一些，而这两套方案都无法满足此需要。