Jak odtwarzać powiadomienia dźwiękowe w przeglądarce Chrome na Androida za pomocą Javascript?

Question

Odtwarzanie MP3 z

var popsound = new Audio('http://gget.it/u1urz3zh/popsound.mp3'); 
 
popsound.load(); 
 
popsound.play();

nie działa w Chrome dla Androida. Według this link jest to cecha, która nie pozwala na odtwarzanie w ten sposób, tj. Bez wyraźnego wprowadzania danych przez użytkownika.

Rozumiem, że robi się to celowo (głównie w celu zapisania danych mobilnych dla użytkownika), ale w jaki sposób sprawić, by witryna odtwarzała dźwięk powiadomienia? Na pewno jest sposób na odtwarzanie dźwięków powiadomień (powiadomienia są popularne na telefon), jak to zrobić?

---

Jeżeli nie jest możliwe, co najmniej, jak wiemy (z JS) czy przeglądarka będzie mogła lub nie wolno odtwarzać dźwięk z .play()? (to będzie możliwe, aby zobaczyć, czy powiadomienia dźwiękowe są dostępne lub nie na stronie)

---

Kontekst: Tworzę web chat service, to jak grać powiadomienie dźwiękowe po Wiadomość została wysłana gdybym nie możesz używać .play() w Chrome na Androida?

Answer 1

Przynajmniej ten trik pozwala z góry wiedzieć, czy odtwarzanie multimediów wymaga gestu użytkownika:

function mediaPlaybackRequiresUserGesture() { 
    var audio = document.createElement('audio'); 
    audio.play(); 
    return audio.paused; 
} 

Found here.

Answer 2

Możesz dodać element audio do DOM i zmienić go dynamicznie za pomocą javascript.

setTimeout(function() { 
 
\t \t \t document.getElementById('audio').src = 'http://gget.it/u1urz3zh/popsound.mp3'; 
 
\t \t \t document.getElementById('audio').load(); 
 
\t \t \t document.getElementById('audio').play(); 
 
\t \t }, 2000);

<audio id="audio"></audio>

Answer 3

Oto jak grałem dźwięku w jednym z mojego projektu WWW, używałem JQuery, ale można go modyfikować trochę do pracy w JavaScript lub zamiast używać jQuery.

utwórz dźwięk znacznika HTML i ustaw jego źródło.

<audio id="chatAudio"><source src="01.mp3" type="audio/mpeg"></audio> 

i uruchomić metodę odtwarzania dźwięku za pomocą JQuery.

$('#chatAudio')[0].play(); 

Nie jestem pewien, czy to działa, czy nie. ale możesz spróbować w ten sposób.

Answer 4

Poznałem ten sam problem w mojej aplikacji. Mój scenariusz użycia aplikacji wyglądał następująco:
1) kliknij przycisk, aby wyświetlić tabelę z informacją (działanie użytkownika)
2) wyświetl tabelę i odśwież dane w niej przez AJAX
3) odtwarzaj dźwięk po zmianie danych
Szczęśliwie miałem działanie użytkownika (krok 1), więc mogłem "zainicjować" dźwięk przez niego, a następnie odtwarzać go za pomocą javascript bez działania użytkownika. Zobacz kod.

HTML

<audio id="kohoutAudio"> 
    <source src="views/images/kohout.mp3"> 
</audio> 

<button id="btnShow">Show table</button> 

JavaScript

$("#btnShow").click(function() { 
    //some code to show the table 
    //initialize the sound 
    document.getElementById('kohoutAudio').play(); 
    document.getElementById('kohoutAudio').pause(); 
    }); 

function announceChange(){ 
    document.getElementById('kohoutAudio').play(); 
};