Android设备同时使用Web Speech API与navigator.mediaDevices兼容问题求助

我需要在Android设备上实现以下功能：用户按住按钮时，同时通过Web Speech API将语音转写为文本，并使用navigator.mediaDevices录制语音。该功能在Windows系统上运行正常，但在Android设备中，Web Speech API与MediaRecorder存在兼容性问题。

问题表现 #

添加以下代码行后，语音识别功能直接失效：

rec = new MediaRecorder(stream); // 添加此行后语音识别功能损坏

提供的代码保留了这一行，用于复现Android设备上的异常情况。注意：请务必在Android设备上测试，代码并非为桌面端设计。

演示代码 #

HTML #

<button id="start-recognition">按住说话（Android设备上测试并查看控制台）</button>

CSS #

#start-recognition {
    width: 50%;
    height: 100px;
}

JavaScript #

let audioChunks = [];
let rec;

let stopRecognize;

if(navigator.mediaDevices) {
        navigator.mediaDevices.getUserMedia({ audio: true })
        .then(stream => {
            console.log('OK')
            rec = new MediaRecorder(stream); // 添加此行后语音识别功能损坏
            // rec.ondataavailable = e => {
            //     audioChunks.push(e.data);
            //     if(rec.state == "inactive") {
            //         blob = new Blob(audioChunks, { type:'audio/x-mpeg-3' });
            //         recordedAudio.src = URL.createObjectURL(blob);
            //     }
            // }
        }).catch(err => {
            switch(err.name) {
                case 'NotAllowedError':
                    console.log('用户拒绝了录音权限！');
                  
                break; 
                default:
                    console.log('未连接麦克风：' + err.name);
          
                break;
            }
        });
    }

const isMobile = true;

async function Recognize() {
  console.log('Recognize')
    let recognitionAllowed = true;
    stopRecognize = function() {
        if(recognitionAllowed) {
            recognition.stop();
            recognitionAllowed = false; 
        }
    }

    var SpeechRecognition = SpeechRecognition || webkitSpeechRecognition;
    var SpeechGrammarList = SpeechGrammarList || webkitSpeechGrammarList;
    var SpeechRecognitionEvent = SpeechRecognitionEvent || webkitSpeechRecognitionEvent;
    var recognition = new SpeechRecognition();
    var speechRecognitionList = new SpeechGrammarList();
    recognition.grammars = speechRecognitionList;
    recognition.lang = 'en-GB';
    recognition.continuous = !isMobile;
    recognition.interimResults = true;
    recognition.maxAlternatives = 1;
    recognition.start();

    recognition.onresult = function(event) {
        window.interim_transcript = '';
        window.speechResult = '';
        for(var i = event.resultIndex; i < event.results.length; ++i) {
            if(event.results[i].isFinal) {
                speechResult += event.results[i][0].transcript;
                console.log(speechResult)
            } else {
                interim_transcript += event.results[i][0].transcript;
                console.log(interim_transcript)
            }
        }
    }

    recognition.onerror = function(event) {
        restartRecognition();
        console.log('识别错误：' + event.error);
    }

    recognition.onend = async function(event) { 
        restartRecognition();
    }

    function restartRecognition() {
        try { if(recognitionAllowed) recognition.start(); } catch(err) {}
    }

} 

const startRecognition = document.getElementById('start-recognition');
startRecognition.addEventListener('mousedown', handleRecognitionStart);
startRecognition.addEventListener('mouseup', handleRecognitionEnd);
startRecognition.addEventListener('touchstart', handleRecognitionStart);
startRecognition.addEventListener('touchend', handleRecognitionEnd);

function handleRecognitionStart(e) {
  console.log('handleRecognitionStart')
    const event = e.type;
    if(isTouchDevice && event == 'touchstart') {
        recognitionStart();
    } else if(!isTouchDevice && event == 'mousedown') {
        recognitionStart();
    }
}
const isTouchDevice = true;

function handleRecognitionEnd(e) {
    const event = e.type;
    if(isTouchDevice && event == 'touchend') {
        recognitionEnd();
    } else if(!isTouchDevice && event == 'mouseup') {
        recognitionEnd();
    }
}

function recognitionEnd() {
    resetRecognition();
}

function recognitionStart() {
  console.log('recognitionStart')
    Recognize();
    audioChunks = []; 
    // if(rec.state !== 'recording') rec.start();
}

function resetRecognition() {
  console.log('reset')
    if(typeof stopRecognize == "function") stopRecognize();
    // if(rec.state !== 'inactive') rec.stop();
}

内容的提问来源于stack exchange，提问作者Sara Ree