OfflineAudioContext
OfflineAudioContext
接口是一个 AudioContext
的接口,代表由多个 AudioNode
连接在一起构成的音频处理图。与 AudioContext
标准相反的是, OfflineAudioContext
不在硬件设备渲染音频;相反,它尽可能快地生成音频,输出一个 AudioBuffer
作为结果。
构造函数
OfflineAudioContext.OfflineAudioContext()
-
创建一个新的
OfflineAudioContext
实例。
属性
从父级 AudioContext
获取属性。
OfflineAudioContext.length
只读-
代表采样帧缓冲区大小的整数。
事件处理程序
OfflineAudioContext.oncomplete
(en-US)-
当进程完成时,基于事件版本的
OfflineAudioContext.startRendering()
(en-US) 被使用之后,事件处理器将会被调用,complete
事件类型为OfflineAudioCompletionEvent
(en-US))被触发。
方法
从父级 AudioContext
和 EventTarget
获取方法的实现。
OfflineAudioContext.resume()
(en-US)-
恢复一个被暂停的音频的时间进程。
OfflineAudioContext.suspend()
-
在指定的时间安排音频暂停时间进程,并且通过 Promise 返回。
OfflineAudioContext.startRendering()
(en-US)-
开始渲染音频,考虑当前连接和当前计划的修改。这个页面涵盖基于事件的和基于 Promise 的版本。
示例
这个简单的例子中,我们声明了 AudioContext
和 OfflineAudioContext
对象。我们使用 AudioContext
去加载一个 XHR(AudioContext.decodeAudioData
)获取的音轨,然后使用 OfflineAudioContext
去渲染音频并得到一个 into an AudioBufferSourceNode
,并播放这个音轨。在离线音频处理图建立后,你需要去使用 OfflineAudioContext.startRendering
(en-US) 来渲染它成为 AudioBuffer
。
当 startRendering()
的 Promise
解决后,渲染也完成了,在 Promise
内可以获得输出的 AudioBuffer
。
在此刻,我们创建了一个另外的音频上下文,在它里面创建了一个 AudioBufferSourceNode
,并且设置它的 buffer 为之前生成的 Promise 中的 AudioBuffer。这样它就可以作为简单标准音频图来播放了
。
备注: 为了获取可以运行的例子,请看我们在 Github 的仓库 offline-audio-context-promise (也可以看到 源代码。)
js
// 定义一个在线或者离线的音频上下文
var audioCtx = new AudioContext();
var offlineCtx = new OfflineAudioContext(2, 44100 * 40, 44100);
source = offlineCtx.createBufferSource();
// 使用 XHR 去加载一个音轨,
// 使用 decodeAudioData 去解码,
// 使用 OfflineAudioContext 去渲染它
function getData() {
request = new XMLHttpRequest();
request.open("GET", "viper.ogg", true);
request.responseType = "arraybuffer";
request.onload = function () {
var audioData = request.response;
audioCtx.decodeAudioData(audioData, function (buffer) {
myBuffer = buffer;
source.buffer = myBuffer;
source.connect(offlineCtx.destination);
source.start();
//source.loop = true;
offlineCtx
.startRendering()
.then(function (renderedBuffer) {
console.log("渲染完全成功");
var audioCtx = new (window.AudioContext ||
window.webkitAudioContext)();
var song = audioCtx.createBufferSource();
song.buffer = renderedBuffer;
song.connect(audioCtx.destination);
play.onclick = function () {
song.start();
};
})
.catch(function (err) {
console.log("渲染失败:" + err);
// 注意:当 OfflineAudioContext 上 startRendering 被立刻调用,Promise 应该被 reject
});
});
};
request.send();
}
// 运行 getData 去开始这个进程
getData();
规范
Specification |
---|
Web Audio API # OfflineAudioContext |
浏览器兼容性
BCD tables only load in the browser