作家
登录

HTML5音频API Web Audio

作者: 来源: 2017-08-09 17:37:58 阅读 我要评论

此文介绍HTML5音频API的重要框架和工作流程,因为音频处理模块很多,是以只简单介绍几种音频处理模块,并经由过程例子来展示效不雅。后续会介绍应用HTML5音频API实现的项目,迎接大年夜家存眷,敬请等待。

用于音量变更。它是一个 AudioNode 类型的音频处理模块。

AudioContext

AudioContext 是一个音频高低文,像一个大年夜工厂,所有的音频袈溱这个音频高低文中处理。

  1. let audioContext = new(window.AudioContext || window.webkitAudioContext)(); 

停止播放,留意调用该办法后,无法再次调用 AudioBufferSourceNode.start 播放。

AudioContext.createGain()

AudioContext 音频高低文供给了很多属性和办法,用于创建各类音频袈浯和音频处理模块等,这里只介绍一部分,更多属性和办法可到MDN查阅文档。

属性

AudioContext.destination

办法

AudioContext.createBufferSource()

创建一个 AudioBufferSourceNode 对象, 他可以经由过程 AudioBuffer 对象来播放和处理包含在内的音频数据。

创建一个 GainNode,它可以控制音频的总音量。

AudioContext.createBiquadFilter()

创建一个 BiquadFilterNode,它代表代表一个双二阶滤波器,可以设置几种不合且常见滤波器类型:高通、低通、带通等。

createOscillator()

创建一个 OscillatorNode, 它表示一个周期性波形,根本上来说创造了一个声调。

音频转换成Buffer格局

应用decodeAudioData()办法把音频文件编译成buffer格局。

bufferSource.buffer = buffer;

  1. function decodeAudioData(audioContext, url) { 
  2.     return new Promise((resolve) => { 
  3.         let request = new XMLHttpRequest(); 
  4.         request.open('GET', url, true); 
  5.         request.responseType = 'arraybuffer'
  6.         request.onload = () => { 
  7.             audioContext.decodeAudioData(request.response, (buffer) => { 
  8.                 if (!buffer) { 
  9.                     alert('error decoding file data: ' + url); 
  10.                     return
  11.                 } else { 
  12.                     resolve(buffer); 
  13.                 } 
  14.             }) 
  15.         } 
  16.         request.onerror = function() { 
  17.             alert('BufferLoader: XHR error'); 
  18.         } 
  19.         request.send(); 
  20.     }) 
  21.  
  22. let buffer = decodeAudioData(audioContext, 

      推荐阅读

      IT的身份危机:随着业务的发展,如何保持其必要性

    对信息技巧的价值不雅及其在组织内的地位的看法赓续地产生着变更。下面来看看若何保持相干性。相反,指出企业高管可能没有留意到的问题。Brady说:“你的人际关系袈浣好,你懂得营业>>>详细阅读


    本文标题:HTML5音频API Web Audio

    地址:http://www.17bianji.com/lsqh/36631.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)