Recherche avancée

Sur d’autres sites (10204)

• Updated(reproducible) - Gaps when recording using MediaRecorder API(audio/webm opus)

  25 mars 2019, par Jack Juiceson

  ----- UPDATE HAS BEEN ADDED BELOW -----

  I have an issue with MediaRecorder API (https://www.w3.org/TR/mediastream-recording/#mediarecorder-api).

  I’m using it to record the speech from the web page(Chrome was used in this case) and save it as chunks.
  I need to be able to play it while and after it is recorded, so it’s important to keep those chunks.

  Here is the code which is recording data :

  navigator.mediaDevices.getUserMedia({ audio: true, video: false }).then(function(stream) {
 recorder = new MediaRecorder(stream, { mimeType: 'audio/webm; codecs="opus"' })
 recorder.ondataavailable = function(e) {
   // Read blob from `e.data`, decode64 and send to sever;
 }
 recorder.start(1000)
})

  The issue is that the WebM file which I get when I concatenate all the parts is corrupted(rarely) !. I can play it as WebM, but when I try to convert it(ffmpeg) to something else, it gives me a file with shifted timings.

  For example. I’m trying to convert a file which has duration 00:36:27.78 to wav, but I get a file with duration 00:36:26.04, which is 1.74s less.

  At the beginning of file - the audio is the same, but after about 10min WebM file plays with a small delay.

  After some research, I found out that it also does not play correctly with the browser’s MediaSource API, which I use for playing the chunks. I tried 2 ways of playing those chunks :

  In a case when I just merge all the parts into a single blob - it works fine.
  In case when I add them via the sourceBuffer object, it has some gaps (i can see them by inspecting buffered property).
  697.196 - 697.528 ( 330ms)
  996.198 - 996.754 ( 550ms)
  1597.16 - 1597.531 ( 370ms)
  1896.893 - 1897.183 ( 290ms)

  Those gaps are 1.55s in total and they are exactly in the places where the desync between wav & webm files start. Unfortunately, the file where it is reproducible cannot be shared because it’s customer’s private data and I was not able to reproduce such issue on different media yet.

  What can be the cause for such an issue ?

  ----- UPDATE -----
  I was able to reproduce the issue on https://jsfiddle.net/96uj34nf/4/

  In order to see the problem, click on the "Print buffer zones" button and it will display time ranges. You can see that there are two gaps :
  0 - 136.349, 141.388 - 195.439, 197.57 - 198.589

  1. 136.349 - 141.388
  2. 195.439 - 197.57

  So, as you can see there are 5 and 2 second gaps. Would be happy if someone could shed some light on why it is happening or how to avoid this issue.

  Thank you

• Gaps when recording using MediaRecorder API(audio/webm opus)

  9 août 2018, par Jack Juiceson

  ----- UPDATE HAS BEEN ADDED BELOW -----

  I have an issue with MediaRecorder API (https://www.w3.org/TR/mediastream-recording/#mediarecorder-api).

  I’m using it to record the speech from the web page(Chrome was used in this case) and save it as chunks.
  I need to be able to play it while and after it is recorded, so it’s important to keep those chunks.

  Here is the code which is recording data :

  navigator.mediaDevices.getUserMedia({ audio: true, video: false }).then(function(stream) {
 recorder = new MediaRecorder(stream, { mimeType: 'audio/webm; codecs="opus"' })
 recorder.ondataavailable = function(e) {
   // Read blob from `e.data`, decode64 and send to sever;
 }
 recorder.start(1000)
})

  The issue is that the WebM file which I get when I concatenate all the parts is corrupted(rarely) !. I can play it as WebM, but when I try to convert it(ffmpeg) to something else, it gives me a file with shifted timings.

  For example. I’m trying to convert a file which has duration 00:36:27.78 to wav, but I get a file with duration 00:36:26.04, which is 1.74s less.

  At the beginning of file - the audio is the same, but after about 10min WebM file plays with a small delay.

  After some research, I found out that it also does not play correctly with the browser’s MediaSource API, which I use for playing the chunks. I tried 2 ways of playing those chunks :

  In a case when I just merge all the parts into a single blob - it works fine.
  In case when I add them via the sourceBuffer object, it has some gaps (i can see them by inspecting buffered property).
  697.196 - 697.528 ( 330ms)
  996.198 - 996.754 ( 550ms)
  1597.16 - 1597.531 ( 370ms)
  1896.893 - 1897.183 ( 290ms)

  Those gaps are 1.55s in total and they are exactly in the places where the desync between wav & webm files start. Unfortunately, the file where it is reproducible cannot be shared because it’s customer’s private data and I was not able to reproduce such issue on different media yet.

  What can be the cause for such an issue ?

  ----- UPDATE -----
  I was able to reproduce the issue on https://jsfiddle.net/96uj34nf/4/

  In order to see the problem, click on the "Print buffer zones" button and it will display time ranges. You can see that there are two gaps :
  0 - 136.349, 141.388 - 195.439, 197.57 - 198.589

  1. 136.349 - 141.388
  2. 195.439 - 197.57

  So, as you can see there are 5 and 2 second gaps. Would be happy if someone could shed some light on why it is happening or how to avoid this issue.

  Thank you

• No audio output using FFmpeg

  26 mars 2022, par John Mergene Arellano

  I am having problem on Live stream output. I am streaming from mobile app to Node JS server to RTMP. Video output of the live stream is working but not the audio. There is no audio output from live stream.

  


  From my client side, I am sending a stream using the Socket.IO library. I captured the video and audio using getUserMedia API.

  


  navigator.mediaDevices.getUserMedia(constraints).then((stream) => {
    window.videoStream = video.srcObject = stream;
    let mediaRecorder = new MediaRecorder(stream, {
        videoBitsPerSecond : 3 * 1024 * 1024
    });
    mediaRecorder.addEventListener('dataavailable', (e) => {
        let data = e.data;
        socket.emit('live', data);
    });
    mediaRecorder.start(1000);
});


  


  Then my server will receive the stream and write it to FFmpeg.

  


  client.on('live', (stream)=>{
   if(ffmpeg)
       ffmpeg.stdin.write(stream);
});


  


  I tried watching the live video in VLC media player. There is a 5 seconds delay and no audio output.

  


  Please see below for FFmpeg options I used :

  


  ffmpeg = this.CHILD_PROCESS.spawn("ffmpeg", [
   '-f',
   'lavfi',
   '-i', 'anullsrc',
   '-i','-',
   '-c:v', 'libx264', '-preset', 'veryfast', '-tune', 'zerolatency',
   '-c:a', 'aac', '-ar', '44100', '-b:a', '64k',
   '-y', //force to overwrite
   '-use_wallclock_as_timestamps', '1', // used for audio sync
   '-async', '1', // used for audio sync
   '-bufsize', '1000',
   '-f',
   'flv',
   `rtmp://127.0.0.1:1935/live/stream` ]);


  


  What is wrong with my setup ? I need to fix the command so that the live stream will output both video and audio.

  


  I tried streaming to youtube RTMP but still no audio. I am expecting to have an output of video and audio from the getUserMedia API.

  


  What is wrong with my setup ? I need to fix the command so that the live stream will output both video and audio.

  


  I tried streaming to youtube RTMP but still no audio. I am expecting to have an output of video and audio from the getUserMedia API.