我正在使用MediaStreamRecorder.js庫進行Java音訊捕獲。我發現的唯一問題是，當我單擊“停止”以停止錄製時，該選項卡上的紅色錄製圖示仍在那裡。

解決：

navigator.getUserMedia(mediaConstraints, function(stream) {
    window.streamReference = stream;
    onMediaSuccess(stream);
}, onMediaError);

function stopStream() {
    if (!window.streamReference) return;

    window.streamReference.getAudioTracks().forEach(function(track) {
        track.stop();
    });

    window.streamReference.getVideoTracks().forEach(function(track) {
        track.stop();
    });

    window.streamReference = null;
}
 

完整程式碼：

 <div id="result"></div> 
<button class="play">Start</button>
<button class="stop">Stop</button>
<button class="resume">Resume</button>
<button class="salvar">Salvar</button>
  
 <div class="contador"></div>
 

var mediaConstraints = {
    audio: true
};

var mediaRecorder;
var blobURL;

function onMediaSuccess(stream) {
    window.streamReference = stream;
    $(function() {


        mediaRecorder = new MediaStreamRecorder(stream);
        mediaRecorder.mimeType = 'audio/wav';
        mediaRecorder.audioChannels = 1;
        mediaRecorder.ondataavailable = function(blob) {
            // POST/PUT "Blob" using FormData/XHR2
            blobURL = URL.createObjectURL(blob);
            $("#result").append('<audio controls src="' + blobURL + '"></audio><br><a href="' + blobURL + '" target="_blank">' + blobURL + '</a>');
        };
        mediaRecorder.start(5000 * 5000);
        setTimeout(function() {
            mediaRecorder.stop();
        }, 120 * 1000); //Se não clicar em parar, a gravação para automaticamente em 2 minutos.

    });
}

function onMediaError(e) {
    console.error('media error', e);
}

function onStop() {
    mediaRecorder.stop();
    mediaRecorder.stream.stop();
}

var interval;

function contadorIncremento() {
    var count = 1;
    interval = setInterval(function() {
        if (count > 1)
            $('.contador').html("setInterval: Ja passou " + count++ + " segundos!");
        else
            $('.contador').html("setInterval: Ja passou " + count++ + " segundo!");
    }, 1000);
}

function stopContadorIncremento() {
    clearTimeout(interval);
    $('.contador').html("");
}

$(function() {

    $(".play").on("click", function() {
        navigator.getUserMedia(mediaConstraints, onMediaSuccess, onMediaError);
        contadorIncremento();

    });

    $(".stop").on("click", function() {
        mediaRecorder.stop();
        stopContadorIncremento();

        if (window.streamReference) {
            window.streamReference.getAudioTracks().forEach(function(track) {
                track.stop();
            });

            window.streamReference.getVideoTracks().forEach(function(track) {
                track.stop();
            });

            window.streamReference = null;
        }
    });

    $(".resume").on("click", function() {
        mediaRecorder.resume();
    });

    $(".salvar").on("click", function() {
        mediaRecorder.save();
    });



});