为什么MediaRecorder无法启动？ （错误：没有可用的音频或视频轨道）RecordRTC [英] Why does MediaRecorder fail to start? (error: there's no audio or video tracks available) RecordRTC

问题描述

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

---

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

第一次开始录制时，会记录此（发生）错误：

  DOM异常：无法执行开始媒体录音机：
 MediaRecorder无法启动，因为没有音频或视频
可用曲目
   
 
 
 使用recorderType ：MediaStreamRecorder 
在MediaRecorder上传递以下配置API.Object {audio：true，mimeType：audio / webm，checkForInactiveTracks：true，type：audio，initCallback：[object Function]} 
  
以下是代码中的回溯。它首先调用 startRecording （在一个稀有事件传奇中）： 
 
 
 常规记录=产量选择（getRecorder）
产量调用（recorder.startRecording）
  
  startRecording  
  startRecording =（）=> {
 
 try {
 this.captureUserMedia（（stream）=> {
 try {
 this.rtcRecorder.startRecording（）
 this.recording = true 
} catch（err）{
 sendEmail（err，inner startRecording failed，[e-mail]）
 console.log（inner startRecording ERROR：，err ）
} 
}）; 
} catch（err）{
 sendEmail（err，startRecording failed，[e-mail]）
 console.log（startRecording ERROR：，err）
 
 
 $ b  
以下是 captureUserMedia  code $：
 $ b $ pre $  captureUserMedia（回调）{
 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版本似乎不是问题：一些使用 v61.0.3163.100 的用户遇到了问题，而另一些用户却没有使用
   
   
   
   
   2. 对于遇到问题的用户而言，似乎每次都会发生。显然， navigator.getUserMedia 已被弃用，但仍然应该起作用 - 承诺的复杂逻辑可能会引入错误。
   
   
   

   
   

更新：

4. 问题发生在两个大型网络用户（大学网络和公立学区网络）。它还没有发生过任何使用私人家庭网络的用户......

让我知道其他信息会有帮助，我会立即回复。谢谢。



更新：

Muaz Khan建议添加一个隐藏的音频元素以防止流和音轨停止/释放。这是在捕获流之前添加的附加代码（当记录器首次初始化时）：

  var hiddenAudio = document.createElement （ '音频'）; 
 hiddenAudio.srcObject = stream //此行是确保流媒体音轨不会停止/释放所必需的
 hiddenAudio.muted = true 
 hiddenAudio.play（）
  code> 

更新2：

但它仍然无效。想一想为什么这可能没有奏效：

1. 我不确定hiddenAudio HTML元素是否真的持久并捕获了流。 （它的范围可能不正确。）

我还想知道<$ c $的回调地狱中是否存在细微的错误c> navigator.getUserMedia ，并且使用更新的 navigator.mediaDevices getusermedia （它依赖于promise）会更简单。

另一种可能性是，当记录器初始化时引入了错误 - 这是：

  initialize =（callback）=> {
 
 if（!! this.rtcRecorder）{
 console.log（'试图初始化一个已经初始化的记录器，但是那个''预期的'）
 return $ b $（'stream，error）=> {
 
 if（（$'
 
 $ b console.log（'initialize Recorder-requestUserMedia'）
 this.captureUserMedia错误）{
 console.log（'！errror capture user media !!'）
返回回调&&回调（错误）
} 
 
 / / TODO：检测系统是否可以播放webms 
 
 //<  - 小档案大小
 // this.rtcRecorder = RecordRTC（stream，{recorderType：RecordRTC.StereoAudioRecorder，bitsPerSecond：30000， numberOfAudioChannels：1，mimeType：'audio / wav'}）; 
 
尝试{
 
 // MUAZ KHAN编辑
 var hiddenAudio = document.createElement（'音频'）; 
 hiddenAudio.srcObject = stream //此行是确保流媒体音轨不会被停止/释放所必需的
 hiddenAudio.muted = true 
 hiddenAudio.pl ay（）
 
 
 this.rtcRecorder = RecordRTC（stream，{audio：'true'，mimeType：'audio / webm'，checkForInactiveTracks：'true'}）; 
回拨&& callback（null）
 return true $ b $ catch（err）{
 sendEmail（err，captureMedia（最内层）startRecording失败，[e-mail]）
 console.log（captureMedia（最内层）startRecording ERROR：，err）
 callback&&回调（null）
返回true 
} 
 
 
}）; 
}; 
  

再次感谢。

更新：

在这里包括两个用户遇到这个问题的概况（大型公立学校/大学网络）。私人家庭网络上的用户不会遇到这个问题：

解决方案

问题在于 captureUserMedia 访问数据流：

$ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ var params = {audio：true，video：false} ;
navigator.getUserMedia（params，（stream）=> {
callback（stream）
}，（err）=> {
callback（null，err）
}）
return
}


UPDATE: Current best hypothesis is that this is somehow caused by the large school/university networks— other users aren't having the problem.

---

I'm using RecordRTC to record audio. That relies on MediaRecorder.

Upon first starting the recording, this (caught) error is logged:

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

Before that, RecordRTC calls the MediaRecorder API:

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

And here's the traceback in the code. It starts with a call to startRecording (in a redux saga):

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

Here's startRecording

startRecording = () => {

try {
  this.captureUserMedia((stream) => {
    try {
       this.rtcRecorder.startRecording()
     this.recording = true
    } catch (err) {
      sendEmail(err, "inner startRecording failed", "[e-mail]")
      console.log("inner startRecording ERROR: ", err)
    }
  });
} catch (err) {
    sendEmail(err, "startRecording failed", "[e-mail]")
    console.log("startRecording ERROR: ", err)
}

}

Here's 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)
 });
};

The error seems to occur at this line in particular of startRecording:

this.rtcRecorder.startRecording()

There are a few more details that might be helpful in solving this:

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....

Let me know what other info would be helpful and I'll respond immediately. Thank you.

UPDATE:

Muaz Khan suggested adding a hidden audio element to prevent the stream and tracks from being stopped/released. Here's the additional code that was added before capturing a stream (when the recorder is first initialized):

    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()

UPDATE 2:

But it's still not working. A thought on why that may not have worked:

1. I'm not sure that the hiddenAudio HTML element is actually persisting and capturing the stream. (It could be scoped incorrectly.)

I'm left wondering if there's a subtle error in the callback hell of navigator.getUserMedia and that using the newer navigator.mediaDevices getusermedia (which relies on promises) would be simpler to follow.

The other possibility is that the error is introduced when the recorder is initialized— that's here:

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", "[e-mail]")
    console.log("captureMedia (inner-most) startRecording ERROR: ", err)
    callback && callback(null)
    return true
  }


});
};

Thanks again.

UPDATE:

Including here the profiles of two users who are having this problem (both of large public school/university networks). The problem is not happening to users on private home networks:

解决方案

The problem was which captureUserMedia which needed access to the stream:

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

这篇关于为什么MediaRecorder无法启动？ （错误：没有可用的音频或视频轨道）RecordRTC的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！