MediaStreamRecorder - 录制音频问题

Posted 2023-02-25

【中文标题】MediaStreamRecorder - 录制音频问题

【英文标题】：MediaStreamRecorder - Recording Audio Issue

【发布时间】：2013-10-13 09:52:15

【问题描述】：

我刚刚翻遍并组装了一个音频视频记录器，它将分别记录音频和视频流并将它们上传到我的服务器，在那里他们将加入。

但是，我的实现在几秒钟​​后音频下降，主要是 7 秒和 14 秒。

我正在使用 RecordRTC javascript 库，链接如下：https://www.webrtc-experiment.com/RecordRTC.js

这是代码： var record = document.getElementById('replyfallback_record'); var stop = document.getElementById('replyfallback_cancel');

var audio = document.querySelector('audio');

var recordVideo = document.getElementById('record-video');
var preview = document.getElementById('replyfallback_video');

var recordAudio, recordVideo, progress;

$('#replyfallback_record').click(function()
    switch($('#replyfallback_record').text())
        case "Record":
            //setup some variables
            var video_constraints = 
                mandatory:  ,
                optional: []
            ;
            //trigger navigator.getUserMedia
            navigator.getUserMedia(
                audio: true,
                video: true
            , function(stream) 
                preview.src = window.URL.createObjectURL(stream);
                preview.play();

                // var legalBufferValues = [256, 512, 1024, 2048, 4096, 8192, 16384];
                // sample-rates in at least the range 22050 to 96000.
                recordAudio = RecordRTC(stream, 
                    type: 'audio',
                    bufferSize: 16384,
                    sampleRate: 45000
                );

                /*recordVideo = RecordRTC(stream, 
                    type: 'video'
                );*/

                recordAudio.startRecording();
                //recordVideo.startRecording();
                $('#replyfallback_record').text("Stop & Submit");
            );
            break;
        case "Stop & Submit":
            $('#replyfallback_record').attr('disable','disable');
            fileName = uid();
            recordAudio.stopRecording(function(url)
                window.open(url);
            );
            PostBlob(recordAudio.getBlob(), 'html5UploadAudio', fileName);

            //recordVideo.stopRecording();
            //PostBlob(recordVideo.getBlob(), 'HTML5UploadVideo', fileName);

            preview.src = '';
            $('#replyfallback_record').text("submitting...");
            break;
    

);

//basic ajax request object function
function xhr(url, data, progress, callback) 
    var request = new XMLHttpRequest();
    request.onreadystatechange = function() 
        if (request.readyState == 4 && request.status == 200) 
            callback(request.responseText);
        
    ;

    request.onprogress = function(e) 
        if(!progress) return;
        if (e.lengthComputable) 
            progress = (e.loaded / e.total) * 100;
        
        $('#replyfallback_record').text("submitting..."+progress);
        if(progress == 100)
            progress = 0;
        
    ;
    request.open('POST', url);
    request.send(data);


function PostBlob(blob, fileType, fileName) 
    // FormData
    var formData = new FormData();
    formData.append('filename', fileName);
    formData.append('blob', blob);
    formData.append("function",fileType);
    if(fileType=="HTML5UploadVideo")
        formData.append("CN_UL_title",$('#replyfallback_title').val());
        formData.append("CN_UL_description",$('#replyfallback_desc').val());
        formData.append("CN_UL_category","1");
    
    // POST the Blob
    xhr(SITE.api, formData, progress, function(data) 
        $('#replyfallback_record').text("Record");
        alert(data+" | "+getReadableFileSizeString(recordAudio.getBlob().size));
    );

【问题讨论】：

这里的专家怎么了？有需要请回复。

【参考方案1】：

回复有点晚，但可能会对未来的访客有所帮助。

请在 stopRecording 回调函数中尝试 PostBlob(recordAudio.getBlob(), 'HTML5UploadAudio', fileName);。

recordAudio.stopRecording(function(url)
    PostBlob(recordAudio.getBlob(), 'HTML5UploadAudio', fileName);
    window.open(url);
);