HTML5 Audio时代的MIDI音乐文件播放

大家都知道,HTML5 Audio标签能够支持wav, webm, mp3, ogg, acc等格式,但是有个很重要的音乐文件格式midi(扩展名mid)却在各大浏览器中都没有内置的支持,因为mid文件并不像其他声音文件那样记录声音的采样信息,而是记录了乐器的演奏指令,二者的原理截然不同。 mid文件格式的最突出的有点是文件极小,几分钟的音乐可能只

  

  大家都知道,HTML5 Audio标签能够支持wav, webm, mp3, ogg, acc等格式,但是有个很重要的音乐文件格式midi(扩展名mid)却在各大浏览器中都没有内置的支持,因为mid文件并不像其他声音文件那样记录声音的采样信息,而是记录了乐器的演奏指令,二者的原理截然不同。

  mid文件格式的最突出的有点是文件极小,几分钟的音乐可能只有几K的文件大小,mp3等其他格式则至少要几M以上,所以midi在手机和web上有很大的优势,特别是适合做各种铃声,背景音乐。

  标签已经过时了,很多浏览器都不再支持。

  无论是标准组织,还是浏览器厂商,都主张使用来播放音频文件。

  考虑到要求支持MIDI的广泛呼声,W3C有指定了一个Web MIDI API草案,但这个草案还非常新,浏览器还没有支持。

  为了让midi在html5 audio上播放出来,需要动用Javascript 来处理。

  我这里推荐3个非常好的Javascript实现的audio播放midi:

  MIDI.js - Sequencing in Javascript.

  这是一个js库,封装了一些接口方便web开发者调用播放mid音乐文件。

  

  Color Piano V2

  这是一个彩色钢琴,你可以手动弹奏,也可以自动弹奏动态加载的mid文件。

  

  Audiotool

  这是一个强大的电子音乐合成工具了,没有一点器乐知识的话,可能基本不懂用了,比如我。

  

  本文来自cuixiping的博客,原文地址:http://blog.csdn.net/cuixiping/article/details/7826138

   

HTML5 Audio时代的MIDI音乐文件播放,布布扣,bubuko.com

时间: 2024-08-26 10:14:32

HTML5 Audio时代的MIDI音乐文件播放的相关文章

最简单的方法实现MIDI音乐循环播放 (不用在MCI回调中处理)

前几天,需要在一个Delphi小程序中需要循环播放一段midi音乐.为什么不是mp3或wav或其它?因为midi格式体积小.(总之我有我的必然理由,多喷无义意) 播放功能选择使用MMSystem中的mciSendString函数来实现,注意到"OPEN"操作时需要指定媒体类型为"TYPE SEQUENCER"(就是指midi音频),接下来使用"PLAY XXREPEAT"操作希望能循环播放,结果不但没有实现循环,而且音乐根本就不播放.详查MSDN

在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"

MUI音乐播放html5+audio模块

html5+ audio 模块MUI播放音频 Audio模块用于提供音频的录制和播放功能,可调用系统的麦克风设备进行录音操作,也可调用系统的扬声器设备播放音频文件.通过plus.audio获取音频管理对象. 权限 "Audio": { "description": "访问音频设备" } 录音 // 扩展API加载完毕,现在可以正常调用扩展API function onPlusReady() { r = plus.audio.getRecorder

HTML5使用Audio标签实现音乐的播放与暂停

最近工作中遇见音乐列表并点击试听,可以试听与暂停的效果.其实HTML5实现这个功能还是很简单的. 首先在网页中嵌入音乐的外链 <a href="javascript:void(0);" onclick="music.changeClass(this,'media');" class="btn btn-green" data-id="edit_btn" data-width="440" data-hei

html5 audio手机播放,锁屏或程序后台运行音乐不播放

今天做一个手机播放页面,发现在ios上只要锁屏或切换其他程序音乐就关闭,找了好久才发现原因. 因为页面之播放一个文件所以我这样写的 <audio id="audio" autoplay="true" controls="" preload="preload"> </audio> 再通过js设置mp3地址 audio.setAttribute("src","http://xx

HTML5之audio实战,网页音乐播放器开发

今天我们就基于 HTML5 audio  来,开发一个网页音乐播放器. 在HTML5 新特性中,audio .video 是我们比较关心的 新 元素,我们终于可以脱离 Flash ,来开发音频.视频播放器了,对于 一个HTML 新元素,无非就是 属性.事件 .方法等等,关于audio 的具体的属性.事件 .方法,请谷歌. 看我们的HTML代码: audio.html <!DOCTYPE html> <html> <head> <meta charset="

HTML5 audio标签自制音乐播放器

相关技能 HTML5+CSS3(实现页面布局和动态效果) Iconfont(使用矢量图标库添加播放器相关图标) LESS (动态CSS编写) jQuery(快速编写js脚本) gulp+webpack(自动化构建工具,实现LESS,CSS,JS等编译和压缩代码) 实现的功能 播放暂停(点击切换播放状态) 下一曲(切换下一首) 随机播放(当前歌曲播放完自动播放下一曲) 单曲循环(点击随机播放图标可切换成单曲循环) 音量调节(鼠标移入滑动设置音量大小) 歌曲进度条(可点击切换进度直接跳,也可以点击小

CEF3 HTML5 audio标签为什么不能播放mp3格式的音频文件

CEF3 HTML5 audio标签 为什么不能播放mp3格式的音频文件 原因略. 解决方法: 找一个最新版的chrome ,我用的是24版本.路径 C:\Documents and Settings\guo\Local Settings\Application Data\Google\Chrome\Application\24.0.1312.57的下面有一个文件ffmpegsumo.dll. 复制出来,替换掉CEF3的同名文件.就好了.

[转载]html5 audio音频播放全解析——html5系列

序 html5开启了一个新时代,因为它让浏览器本身变得不那么被动,audio api就是一个典型的列子,在html5还没确定之前,如果想要在听音乐看视频唯一的办法就是用flash意思是当你没有给浏览器装载Flash插件的话 那么音乐视频即是空谈,html5 audio的出现改变了这一格局,因为你可以不用Flash插件就可以听音乐看视频,当然这些能否实现还跟你用的浏览器有关. 这是demo地址 http://www.feman.cn/h5/audio.html 在手机上浏览效果会更好 文章结构 1