为什么MediaRecorder无法启动？ （错误：没有可用的音频或视频曲目）RecordRTC

Question

更新：当前最好的假设是，这是由大型学校/大学网络引起的 - 其他用户没有问题。

---

我正在使用RecordRTC录制音频。这依赖于MediaRecorder。

在第一次开始记录，这（抓）记录错误：

DOM exception: failed to execute start on Media recorder: The 
MediaRecorder failed to start because there are no audio or video 
tracks available 

在此之前，RecordRTC调用MediaRecorder API：

Using recorderType:MediaStreamRecorder 
Passing following config over MediaRecorder API.Object {audio: "true", mimeType: "audio/webm", checkForInactiveTracks: "true", type: "audio", initCallback: "[object Function]"} 

而这里的代码的回溯。它开始于startRecording呼叫（在终极版传奇）：

const recorder = yield select(getRecorder) 
    yield call(recorder.startRecording) 

这里的startRecording

startRecording =() => { 

try { 
    this.captureUserMedia((stream) => { 
    try { 
     this.rtcRecorder.startRecording() 
    this.recording = true 
    } catch (err) { 
     sendEmail(err, "inner startRecording failed", "support@gmail.com") 
     console.log("inner startRecording ERROR: ", err) 
    } 
    }); 
} catch (err) { 
    sendEmail(err, "startRecording failed", "support@gmail.com") 
    console.log("startRecording ERROR: ", err) 
} 

} 

这里的captureUserMedia：

captureUserMedia(callback) { 
var params = { audio: true, video: false }; 

navigator.getUserMedia(params, callback, (error) => { 
    // alert(JSON.stringify(error)); 
    console.log('USER MEDIA ERROR:: ' + JSON.stringify(error)) 
    callback(null, error) 
}); 
}; 

的错误似乎在此行特别是发生startRecording：

this.rtcRecorder.startRecording() 

有更多的一些细节，可能是解决这个有用：

1. Chrome version does not seem to be the problem: some users with v61.0.3163.100 have the problem, while others don't
   2. For the users who experience the problem, it seems to occur every time.
   3. Apparently, navigator.getUserMedia is deprecated, but it still should function— the complicated logic of the promise could be introducing a bug.

UPDATE：

4. The problem has happened to two users who were on large networks (A university network and a public school district network). It has not yet happened to any users who were on private home networks....

让我了解其他信息将是有益的，我会立刻做出反应。谢谢。

UPDATE：

Muaz汗建议增加一个隐藏的音频元件，以防止从被停止流和曲目/释放。下面是被捕获流（当刻录机第一次初始化）之前添加额外的代码：

var hiddenAudio = document.createElement('audio'); 
    hiddenAudio.srcObject = stream // this line is required to make sure stream tracks aren't stopped/released 
    hiddenAudio.muted = true 
    hiddenAudio.play() 

更新2：

但它仍然没有工作。一个想法，为什么这可能没有奏效：

1. 我不确定隐藏的音频HTML元素实际上持续和捕获流。 （这可能是不正确的作用域。）

我在想，如果有在navigator.getUserMedia回调地狱一个微妙的错误，并且使用较新的navigator.mediaDevices getusermedia（这依赖于承诺）会更简单跟随。

另一种可能性是引入的误差，当录音机initialized-这是这里：再次

initialize = (callback) => { 

if (!!this.rtcRecorder) { 
    console.log('Attempted to initialize an already initialized recorder but that\'s expected') 
    return 
} 

console.log('initialize Recorder -- requestUserMedia') 
this.captureUserMedia((stream, error) => { 

    if (error) { 
    console.log('!!errror capturing user media!!') 
    return callback && callback(error) 
    } 

    // TODO: detect if system can play webms 

    // <-- smaller filesize 
    // this.rtcRecorder = RecordRTC(stream, { recorderType: RecordRTC.StereoAudioRecorder, bitsPerSecond: 30000, numberOfAudioChannels: 1, mimeType: 'audio/wav' }); 

    try { 

    // the MUAZ KHAN edits 
    var hiddenAudio = document.createElement('audio'); 
    hiddenAudio.srcObject = stream // this line is required to make sure stream tracks aren't stopped/released 
    hiddenAudio.muted = true 
    hiddenAudio.play() 


    this.rtcRecorder = RecordRTC(stream, { audio: 'true', mimeType: 'audio/webm', checkForInactiveTracks: 'true' }); 
    callback && callback(null) 
    return true 
    } catch (err) { 
    sendEmail(err, "captureMedia (inner-most) startRecording failed", "support@gmail.com") 
    console.log("captureMedia (inner-most) startRecording ERROR: ", err) 
    callback && callback(null) 
    return true 
    } 


}); 
}; 

感谢。

UPDATE：

这里包括谁是有这个问题（包括大型公共学校/大学网络）两个用户的配置文件。这个问题不是发生在用户的私人家庭网络：当有getUserMedia错误

Answer 1

问题是这captureUserMedia这需要访问流：

captureUserMedia(callback) { 
var params = { audio: true, video: false }; 
navigator.getUserMedia(params, (stream) => { 
    callback(stream) 
}, (err) => { 
    callback(null, err) 
}) 
return 
} 

Answer 2

此代码将失败。更改 this.captureUserMedia((stream) => { 至 this.captureUserMedia((stream, err) => { 并处理err被设置（而流为空）。最简单的重现方法是通过单击地址栏最右侧的摄像头图标来阻止权限。