WebAudio的问题

时间:2019-01-09 12:23:23

标签: web-audio web-audio-api recorder.js

我正在创建一个研究实验,该实验使用WebAudio API记录用户说出的音频文件。 我想出了一个使用recorder.js的解决方案,并且一切正常……直到昨天尝试为止。

我现在在Chrome中收到此错误: “ AudioContext不允许启动。必须在页面上用户手势后恢复(或创建)。” 它引用了以下链接:Web Audio API policy。 这似乎是由于上面链接中概述的Chrome浏览器新政策的结果。

所以我试图通过使用resume()来解决问题:

var gumStream; //stream from getUserMedia()
var rec; //Recorder.js object
var input; //MediaStreamAudioSourceNode we'll be recording

// shim for AudioContext when it's not avb. 
var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioContext = new AudioContext; //new audio context to help us record

function startUserMedia() {
    var constraints = { audio: true, video:false };
    audioContext.resume().then(() => { // This is the new part
        console.log('context resumed successfully');
    });

    navigator.mediaDevices.getUserMedia(constraints).then(function(stream) {

        console.log("getUserMedia() success, stream created, initializing Recorder.js");
    gumStream = stream;
    input = audioContext.createMediaStreamSource(stream);
    rec = new Recorder(input, {numChannels:1});
    audio_recording_allowed = true;
    }).catch(function(err) {
        console.log("Error");
    });

}

现在在控制台中,我得到:

错误

上下文恢复成功

并且流没有初始化。 在Firefox和Chrome中都会发生这种情况。 我该怎么办?

1 个答案:

答案 0 :(得分:1)

我只是遇到了同样的问题!从技术上讲,您帮助我找到了这个答案。由于某种原因,我的错误消息不如您的完整,并且指向这些政策更改的链接得到了答案:)

而不是继续进行,最好的做法是在用户与文档互动后创建音频上下文(当我说最好的做法时,如果您看看padenot在9月28日的第一条评论, 2018年this thread,他在第一个要点中提到了原因)

所以代替这个:

var audioContext = new AudioContext; //new audio context to help us record

function startUserMedia() {
    audioContext.resume().then(() => { // This is the new part
        console.log('context resumed successfully');
    });
}

只需这样设置音频上下文:

var audioContext;

function startUserMedia() {
    if(!audioContext){
      audioContext = new AudioContext;
    } 
}

只要在某种用户手势后执行startUserMedia(),这应该可以工作。