得益于现代HTML5音频和对浏览器支持的Swift采用, 过时的音频播放器已成为过去。 但是Web设计人员可以使用诸如Howler.js之类的纯音频库 更进一步 。
这个免费的开源JS库使您可以播放自定义播放器中嵌入的标准格式的音频文件 。 Howler带有完整的API ,因此您可以为浏览器内HTML5游戏构建简单的音频播放器 , 大型播放列表或循环播放背景音乐 。
Howler最早于2013年初创建,并且经历了多次迭代 。 目前,该项目位于 GitHub上超过7k星的v2.x 上 。
该项目是由一个游戏工作室创建的,该工作室在其网络游戏中使用Howler来获得声音效果和背景音乐。 它支持多种文件类型和编解码器,包括MP3,OGG,WAV,AAC,CAF,M4A,MP4,WEBA,FLAC…命名音频文件,并保证会支持该文件。
如果您只想要一个简单的音频播放器,那么HTML5可能就足够了。 但是Howler具有许多HTML本身无法提供的功能,例如淡入/淡入每首曲目,或自动缓存音乐文件以减少加载时间。
Howler是一个无依赖性的纯JavaScript库,它支持所有主流浏览器,包括:
- Chrome 7+
- Internet Explorer 9+
- Firefox 4+
- 移动Safari 6+
- 歌剧12+
- Microsoft Edge(所有版本)
较旧的浏览器默认使用HTML5音频播放器 ,因此它具有合理的后备选项。
Howler.js中的所有内容都是模块化的 ,因此您可以选择要包括哪些功能,哪些要忽略。 这可以大大减少HTTP请求,从而使音频播放器更易于使用。
您可以在GitHub存储库中找到完整的文档以及主要站点上的实时演示 。
这是迄今为止网络上最广泛的音频库。 它包括用于浏览器游戏的游戏音效FX和可重复的精灵 ,每当用户悬停或单击页面上的某些内容时,都可以调用它们。
在下面,您可以看到CodePen的低音调音网络应用程序 ,它演示了 Howler可以做的一小部分 。 而且,如果您想了解更多信息,请访问Howler GitHub存储库以查找文档并下载最新版本的链接 。
翻译自: https://www.hongkiat.com/blog/howlerjs-javascript-audio-library/