AudioContext.decodeAudioData()

这是从音频轨道创建用于web audio API音频源的首选方法。

语法

旧版的回调函数语法

audioCtx.decodeAudioData(audioData, function(decodedData) {
  // use the dec​oded data here
});

新版的promise-based语法:

audioCtx.decodeAudioData(audioData).then(function(decodedData) {
  // use the decoded data here
});

举例

在本章节中，我们将首先学习基于回调的系统，然后采用新的基于promise-based的语法

旧的回调语法

在这个事例中, getData() 方法使用XHR加载一个音轨,设置请求的responsetype为ArrayBuffer使它返回一个arraybuffer数据，然后存储在audioData变量中. 然后我们将这个arraybuffer数据置于decodeAudioData()方法中使用，当成功解码PCM Data后通过回调返回, 将返回的结果通过AudioContext.createBufferSource()接口进行处理并获得一个AudioBufferSourceNode, 将源连接至AudioContext.destination并将它设置为循环的.

通过按钮来运行 getData() 来获取音轨并播放它. 当使用 stop() 方法后source将会被清除.

// define variables

var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var source;

var pre = document.querySelector('pre');
var myScript = document.querySelector('script');
var play = document.querySelector('.play');
var stop = document.querySelector('.stop');

// use XHR to load an audio track, and
// decodeAudioData to decode it and stick it in a buffer.
// Then we put the buffer into the source

function getData() {
  source = audioCtx.createBufferSource();
  var request = new XMLHttpRequest();

  request.open('GET', 'viper.ogg', true);

  request.responseType = 'arraybuffer';


  request.onload = function() {
    var audioData = request.response;

    audioCtx.decodeAudioData(audioData, function(buffer) {
        source.buffer = buffer;

        source.connect(audioCtx.destination);
        source.loop = true;
      },

      function(e){"Error with decoding audio data" + e.err});

  }

  request.send();
}

// wire up buttons to stop and play audio

play.onclick = function() {
  getData();
  source.start(0);
  play.setAttribute('disabled', 'disabled');
}

stop.onclick = function() {
  source.stop(0);
  play.removeAttribute('disabled');
}


// dump script to pre element

pre.innerHTML = myScript.innerHTML;

新的promise-based语法

ctx.decodeAudioData(compressedBuffer).then(function(decodedData) {
 // use the decoded data here
});

参数

ArrayBuffer

将会被解码的音频数据，可通过XMLHttpRequest或FileReader来获取.

DecodeSuccessCallback

当成功解码后会被调用的回调函数. 该回调函数只有一个AudioBuffer类型参数.

DecodeErrorCallback

一个可选的错误回调函数.

返回

一个 Promise对象.

标准

浏览器支持

See also

• Using the Web Audio API