OfflineAudioContext - 表示通过链接在一起的 AudioNode 构建的音频处理图
OfflineAudioContext
接口是一个 AudioContext
接口,表示通过链接在一起的 AudioNode
构建的音频处理图。与标准 AudioContext
相比,OfflineAudioContext
不会将音频输出到设备硬件。相反,它将尽可能快地生成它,并将结果输出到 AudioBuffer
。
构造函数
OfflineAudioContext.OfflineAudioContext()
创建一个新的 OfflineAudioContext
实例。
属性
还从其父接口 BaseAudioContext
继承了属性。
OfflineAudioContext.length
只读
一个整数,表示样本帧中缓冲区的大小。
事件处理程序
OfflineAudioContext.oncomplete
一个 EventHandler
,在处理终止时,即在触发 complete
事件(类型为 OfflineAudioCompletionEvent
)时,使用基于事件的版本 OfflineAudioContext.startRendering()
之后调用。
方法
还从其父接口 BaseAudioContext
继承了方法。
OfflineAudioContext.suspend()
安排在指定时间暂停音频上下文中的时间进度并返回 Promise。
OfflineAudioContext.startRendering()
考虑到当前连接和当前计划的更改,开始渲染音频。此页面涵盖基于事件的版本和基于 Promise 的版本。
废弃的方法
OfflineAudioContext.resume()
在以前已暂停的音频上下文中恢复时间的进度。
注意:
resume()
方法仍然可用 - 它现在在BaseAudioContext
接口上定义(请参见BaseAudioContext.resume()
),因此可以同时通过AudioContext
和OfflineAudioContext
接口进行访问。
事件
使用 addEventListener()
或通过为此接口的 oneventname
属性分配事件监听器来监听这些事件:
complete
离线音频上下文的渲染完成时触发。也可以使用 oncomplete
事件处理程序属性来使用。
实例
在这个简单的实例中,我们同时声明了 AudioContext
和 OfflineAudioContext
对象。我们使用 AudioContext 通过 XHR(AudioContext.decodeAudioData
)加载音频轨道,然后使用 OfflineAudioContext
将音频渲染到 AudioBufferSourceNode
和播放曲目。设置离线音频图之后,您需要使用 OfflineAudioContext.startRendering
将其渲染到 AudioBuffer
。
In this simple example, we declare both an AudioContext
and an OfflineAudioContext
object. We use the AudioContext
to load an audio track via XHR (AudioContext.decodeAudioData
), then the OfflineAudioContext
to render the audio into an AudioBufferSourceNode
and play the track through. After the offline audio graph is set up, you need to render it to an AudioBuffer
using OfflineAudioContext.startRendering
.
当 startRendering()
Promise 解决时,渲染已完成,在 Promise 内可以获得输出 AudioBuffer
。
至此,我们创建了另一个音频上下文,在其中创建了一个 AudioBufferSourceNode
,并且设置它的 buffer 为之前生成的 Promise 中的 AudioBuffer
。然后将其作为简单的标准音频图的一部分进行播放。
注意:有关工作实例,请参见我们的 offline-audio-context-promise Github 存储库(请参见源代码。)
// 定义在线和离线音频上下文
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('Rendering completed successfully');
var song = audioCtx.createBufferSource();
song.buffer = renderedBuffer;
song.connect(audioCtx.destination);
play.onclick = function() {
song.start();
}
}).catch(function(err) {
console.log('Rendering failed: ' + err);
// 注意:当在 OfflineAudioContext 上再次调用 startRendering 时,Promise 应该拒绝
});
});
}
request.send();
}
// 运行 getData 以启动该过程
getData();
规范
规范 | 状态 | 备注 |
---|---|---|
Web Audio API OfflineAudioContext 的定义 |
工作草案 | 初始定义 |
桌面浏览器兼容性
特性 | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
基础支持 | 14 | 支持 | 25 | 不支持 | 15 | 6 |
OfflineAudioContext() 构造函数 | 551 | 未知 | 53 | 不支持 | 42 | 未知 |
complete event | 14 | 12 | 25 | 不支持 | 15 | 6 |
length | 51 | 14 | 支持 | 不支持 | 38 | 不支持 |
oncomplete | 14 | 12 | 25 | 不支持 | 15 | 6 |
resume | 49 | 支持 | 不支持 | 不支持 | 36 | 不支持 |
startRendering | 14 | 12 | 25 | 不支持 | 15 | 6 |
suspend | 49 | 支持 | 不支持 | 不支持 | 36 | 不支持 |
移动浏览器兼容性
特性 | Android | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
---|---|---|---|---|---|---|---|
基础支持 | 支持 | 18 | 未知 | 26 | 未知 | 14 | 未知 |
OfflineAudioContext() 构造函数 | 552 | 551 | 未知 | 53 | 未知 | 42 | 未知 |
complete event | 支持 | 18 | 未知 | 26 | 未知 | 14 | 未知 |
length | 51 | 51 | 未知 | 支持 | 未知 | 41 | 不支持 |
oncomplete | 支持 | 18 | 未知 | 26 | 未知 | 14 | 未知 |
resume | 49 | 49 | 未知 | 不支持 | 未知 | 36 | 不支持 |
startRendering | 支持 | 18 | 未知 | 26 | 未知 | 14 | 未知 |
suspend | 49 | 49 | 未知 | 不支持 | 未知 | 36 | 不支持 |
1. 在 Chrome 59 之前,不支持默认值。
2. 在 59 版本之前,不支持默认值。