Recording audio with MediaRecorder on iPhone with Safari and Chrome only 1 second long? Mimetype and FFMPEG problem?

Viewed 978

I am using MediaRecorder to record the Microphone audio on a website.

Javascript:

var blob;
var blob_url;
var stream;
var recorder;
var chunks;

var media = {
    tag: 'audio',
    type: 'audio/ogg',
    ext: '.ogg',
    gUM: {audio: true}
};

navigator.mediaDevices.getUserMedia(media.gUM).then(_stream => 
{
    stream = _stream;

    recorder = new MediaRecorder(stream);

    recorder.ondataavailable = e => 
    {
        // push data to chunks
        chunks.push(e.data);

        // recording has been stopped
        if(recorder.state == 'inactive') 
        {
            // audio data available
            blob = new Blob(chunks, {type: media.type });
            blob_url = URL.createObjectURL(blob);
            
            // send data to server
            uploadfile_audio();
        }
    };

    if(typeof(recorder)=='undefined')
    {
        alert('No microphone access');
        return;
    }

    chunks = [];
    recorder.start();
}


// when stop button is clicked
recorder.stop();
stream.getTracks().forEach( track => track.stop() );

The audio stream (ogg format) is sent to the server.

Since iPad/iPhone do not play ogg files, the recording file is converted to "mp3" using FFMPEG.

This file is stored on the server.


This works on Windows and MAC (Chrome and Safari), also on iPad (Safari) but not properly on iPhone (Chrome/Safari). Version: iPhone iOS 15.1.

On iPhone the recording file is only 0:01 min in length. Size is always 17277 Bytes.

What could be the issue? (I cannot debug because I don't have a Mac.)

Does the stream get interrupted? Is the recording stopped after 1 second?

Update 1:

I have checked the incoming filesize of the browser-recorded file serverside. It seems to be coming in properly, because there are different sizes such as 184 kB.

My guess is now that FFMPEG cannot handle the incoming file correctly. Which might have the wrong mimetype set in Javascript with type: 'audio/ogg',. Is another format needed?

The conversion code serverside:

PHP

$mp3file = shell_exec("ffmpeg -i ".$file_locationtmp." -vn -ar 44100 -ac 2 -b:a 128k ".$file_locationtmp.".mp3");

I would need to find out the audio recording format used by iPhone but I couldn't.

I tried to find the supporting mimetypes using https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/isTypeSupported - however, it shows that NO mimetypes are supported on iPhone (neither in Chrome nor Safari).

Update 2:

I used ffprobe to get the recording file information. It says Stream #0:0(und): Audio: aac (LC) (mp4a / 0x6134706D), 44100 Hz, mono, fltp, 2234 kb/s (default)

Update 3:

It seems to be a problem with FFMPEG. See my new question How to convert AAC/MP4A to MP3 using FFMPEG in full length? Audio file gets cut off after 1 second

0 Answers
Related