Открийте дали аудиото се възпроизвежда в Javascript на браузъра

Има ли глобален начин за откриване кога аудиото се възпроизвежда или започва да се възпроизвежда в браузъра.

нещо като идеята за if(window.mediaPlaying()){...

без кодът да е обвързан с конкретен елемент?

РЕДАКТИРАНЕ: Важното тук е да можете да откриете ВСЯКО аудио, независимо откъде идва аудиото. Независимо дали идва от iframe, видео, API за уеб аудио и т.н.


person Chris    schedule 14.04.2015    source източник


Отговори (4)


Никой не трябва да използва това, но работи.

По принцип единственият начин, който намерих за достъп до цялото аудио на прозореца, е чрез MediaDevices.getDisplayMedia().

Оттам MediaStream може да бъде подаден в AnyalizerNode, който може да се използва за проверка дали звукът на звука е по-голям от нула.

Работи само в Chrome и може би в Edge (тествано само в Chrome 80 под Linux)

JSFiddle с <video>, <audio> и YouTube!

Важни части от код (не може да се публикува в работещ фрагмент поради Правила за функции на фрагмента iframe):

var audioCtx = new AudioContext();
var analyser = audioCtx.createAnalyser();

var bufferLength = analyser.fftSize;
var dataArray = new Float32Array(bufferLength);

window.isAudioPlaying = () => {
  analyser.getFloatTimeDomainData(dataArray);
  for (var i = 0; i < bufferLength; i++) {
    if (dataArray[i] != 0) return true;

  }
  return false;
}

navigator.mediaDevices.getDisplayMedia({
     video: true,
     audio: true
   })
   .then(stream => {
      if (stream.getAudioTracks().length > 0) {
        var source = audioCtx.createMediaStreamSource(stream);
        source.connect(analyser);

        document.body.classList.add('ready');
      } else {
        console.log('Failed to get stream. Audio not shared or browser not supported');
      }

   }).catch(err => console.log("Unable to open capture: ", err));
person Trobol    schedule 16.03.2020
comment
Добро решение, но за съжаление не винаги работи. Опитах го в Google Meet, за да открия дали някой говори, но съобщението казва, че звукът се възпроизвежда дори когато никой не говори. - person Aurasphere; 23.05.2021
comment
Изглежда, че от раздела идва малко статичен шум, дори ако всички са заглушени. Направих актуализирана цигулка, която показва графика на аудиото. jsfiddle - person Trobol; 23.05.2021

Наистина, търся много и чета всички MDN документи за API за уеб аудио, но не намирам никакъв глобален флаг на прозорец, който показва възпроизвеждане на аудио, но имам труден начин, който показва ВСЯКО възпроизвеждане на аудио, без значение iframe или видео, но за API за уеб аудио не съм сигурен, трудният начин е:

const allAudio = Array.from( document.querySelectorAll('audio') );
const allVideo = Array.from( document.querySelectorAll('video') );
const isPlaying = [...allAudio, ...allVideo].some(item => !item.paused);

Сега купете флага isPlaying, който можем да открием при игра в браузъра.

person AmerllicA    schedule 18.03.2020
comment
Почти положително, това разчита на аудио/видео елементите да бъдат част от DOM. Почти съм сигурен, че можете да създадете аудио елемент с JS и да го възпроизведете много лесно, без изобщо да го добавяте към DOM; така че това няма да работи за този сценарий. - person Lovethenakedgun; 13.12.2020

Търсих решение в Google, но все още не намерих нищо. Може би бихте могли да проверите някои данни, които имат стойност X само когато се възпроизвежда аудио. Ако имате някакъв бутон, който стартира възпроизвеждането на аудио файла, може би можете да сте сигурни, че аудиото се възпроизвежда, като добавите слушател на събития към rep. бутон...

Може би нещо като добавяне на слушател на събития към маркера "audio"? Ако си спомням правилно, аудио тагът има атрибут "paused"... И сега си спомням, че аудиото има атрибут "paused"...

Освен това може да искате да проверите тази тема HTML5 проверка дали аудиото се възпроизвежда?

просто го намерих преди пет секунди jaja

person Emilio    schedule 14.04.2015

Има свойство playbackState (https://developer.mozilla.org/en-US/docs/Web/API/MediaSession/playbackState), но не всички браузъри го поддържат.

if(navigator.mediaSession.playbackState === "playing"){...
person NinaW    schedule 14.03.2020
comment
без кодът да е обвързан с конкретен елемент е решаващ аспект на въпроса. (Поне за мен.) - person brillout; 15.03.2020
comment
Вярно е, че в този случай playbackState трябва първо да бъде зададено за елемента (по подразбиране е "none"), но може да бъде зададено за всеки медиен източник. - person NinaW; 15.03.2020
comment
Ако нямате контрол върху изходния елемент, можете да следвате логиката на Ed и да потърсите медийни елементи във вашия документ (аудио, видео, iframe) и да проверите дали някой от тях възпроизвежда аудио. - person NinaW; 15.03.2020
comment
Ще трябва да прекарам известно време в това. Има някои опции за достъп до документа на iframe и неговия вътрешен DOM като contentWindow (developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement/) и frames (developer.mozilla.org/en-US/docs/Web/API/Window/frames). Намерих също свързан въпрос в stackoverflow.com/questions/43745161/, което може да е полезно. - person NinaW; 15.03.2020