landocss Ответов: 1

Как добавить аудио в getdisplaymedia?


Я делаю screen recorder с помощью javascript. Вот этот код:

const start = document.getElementById("start");
const stop = document.getElementById("stop");
const video = document.querySelector("video");
let recorder, stream;

async function startRecording() {
  stream = await navigator.mediaDevices.getDisplayMedia({
    video: true,
     audio:true
  }); 

  recorder = new MediaRecorder(stream);

  const chunks = [];
  recorder.ondataavailable = e => chunks.push(e.data);
  recorder.onstop = e => {
     let link = document.createElement('a');
     const myValue = prompt("filename:", ".webm");
     link.download = myValue;
    const completeBlob = new Blob(chunks, { type: chunks[0].type });
    video.src = URL.createObjectURL(completeBlob);z
     link.href = URL.createObjectURL(completeBlob);
     link.click();
URL.revokeObjectURL(link.href);
   
    
  };

  recorder.start();
}

start.addEventListener("click", () => {
  start.setAttribute("disabled", true);
  stop.removeAttribute("disabled");

  startRecording();
});

stop.addEventListener("click", () => {
  stop.setAttribute("disabled", true);
  start.removeAttribute("disabled");

  recorder.stop();
  stream.getVideoTracks()[0].stop();
 
});


Что я уже пробовал:

Как бы я добавил аудио к этому с помощью getDisplayMedia? Я попробовал это сделать:
const gdmOptions = {
  video: { mediaSource: "screen" },
  audio: true
}
async function startRecording() {
  stream = await navigator.mediaDevices.getDisplayMedia(gdmOptions); 
...

Это вышло прямо из докторов MDN Здесь

Но это не сработало. Я использую chrome. Пожалуйста, скажи мне, что я делаю не так. Спасибо и хорошего вам дня!

1 Ответов

Рейтинг:
0

Richard Deeming

Перед началом проекта, который потребует совместного использования аудио, обязательно проверьте Совместимость браузера[^] в MediaDevices.getDisplayMedia (), чтобы увидеть, есть ли у браузеров, с которыми вы хотите иметь совместимость, поддержка звука в захваченных потоках экрана.
...
Захват аудио всегда необязателен, и даже когда веб-контент запрашивает поток как с аудио, так и с видео, возвращаемый MediaStream все равно может иметь только одну видеодорожку без звука.
В Windows и Chrome OS можно захватить весь системный звук, но в Linux и Mac можно захватить только звук вкладки.
Даже если вы используете поддерживаемую ОС, настройки браузера могут помешать записи звука. Или пользователь может отклонить запрос на запись своего аудио.

И это хорошо. Вы действительно не хотите, чтобы каждый случайный сайт, который вы посещаете, мог слушать ваши личные разговоры!