WebRTC/getUserMedia - Включенный микрофон глушит видео

Стандартный WebRTC - JS Записывает видео на сервер при нажатии на кнопку "Старт", заканчивает по кнопке "стоп".

const URL = 'voi';

var gumVideo = document.querySelector('video#gum');
gumVideo.setAttribute('autoplay', '');
  gumVideo.setAttribute('muted', '');
  gumVideo.setAttribute('playsinline', '');
let div = document.createElement('div');
div.id = 'messages';
let start = document.createElement('button');
start.id = 'start';
start.innerHTML = 'Начать запись';
let stop = document.createElement('button');
stop.id = 'stop';
stop.innerHTML = 'Остановить';
document.body.appendChild(div);
document.body.appendChild(start);
document.body.appendChild(stop);
navigator.mediaDevices.getUserMedia({  audio: {
     channelCount: 1,
     sampleRate: 16000,
     sampleSize: 16,
     volume: 1
   },
  video: {width: 640, height: 480  },video: { frameRate: { ideal: 15, max: 20 } }})
.then(stream => {
    const mediaRecorder = new MediaRecorder(stream);
    document.querySelector('#start').addEventListener('click', function(){
        mediaRecorder.start();
    });
    gumVideo.srcObject = stream;
    let audioChunks = [];
    mediaRecorder.addEventListener("dataavailable",function(event) {
        audioChunks.push(event.data);
    });

    document.querySelector('#stop').addEventListener('click', function(){
        mediaRecorder.stop();
    });

    mediaRecorder.addEventListener("stop", function() {
        const audioBlob = new Blob(audioChunks, {
            type: "video/webm"
        });

        let fd = new FormData();
        fd.append('voice', audioBlob);
        sendVoice(fd);
        audioChunks = [];
    });
});

async function sendVoice(form) {
let promise = await fetch(URL, {
    method: 'POST',
    body: form});
if (promise.ok) {
    let response =  await promise.json();
    console.log(response.data);
    audio.src = response.data;
    audio.controls = true;
    audio.autoplay = true;
    document.querySelector('#messages').appendChild(audio);
}
}

Есть проблема на телефонах: На сайте, перед записью воспроизводится видео, но после того как даем доступ к камере и микрофону, звук в воспроизводимом видео - почти полностью заглушается.

Суть я понимаю, причина - работающий микрофон, так как если сделать:

navigator.mediaDevices.getUserMedia({  audio: false

Проблема уходит. Но мне нужен аудио поток для записи.

Нужно: чтобы не глушилось видео после того, как дали доступ к Микрофону и Камере.

P.S. В онлайн-чатах с телефона подобной проблемы нет, звук нормальный не смотря на то, что предоставлен доступ к микрофону.


Ответы (0 шт):