Подтвердить что ты не робот

HTML5 Audio не может воспроизводиться через Javascript, если только вручную его не запускать вручную

Я пытаюсь получить небольшой звуковой файл, чтобы играть автоматически, используя тег и javascript, чтобы инициировать его.

<audio id="denied" preload="auto" controls="false">
    <source src="sound/denied.wav" />
 </audio>

И затем через javascript, в соответствующее время:

$('#denied')[0].play()

Прекрасно работает на Chrome на моем рабочем столе. В Android 4.1.1 звук не будет воспроизводиться, если только я не нажму "воспроизведение" на аудиоустройствах HTML5 до того, как javascript попытается воспроизвести его.

Таким образом, в основном браузер Android (фондовый или Dolphin) не будет воспроизводить аудио, если пользователь не инициирует его в какой-то момент перед javascript. Это предназначено? Есть ли способ обойти это?

4b9b3361

Ответ 1

Ну, для моих целей, вот что я сделал:

К счастью, прежде чем пользователь сможет инициировать поведение для запуска звука, ему нужно нажать кнопку. Я устанавливаю объем элемента равным 0.0, и он "играет", когда нажимает эту кнопку.

После того, как звук будет воспроизводиться беззвучно, я просто установил свойство volume обратно в 1.0, и он воспроизводится без вмешательства пользователя просто.

Ответ 2

В моем случае это было простое решение:
fooobar.com/questions/217103/...
Скопируйте и вставьте это в свой хром:

chrome://flags/#autoplay-policy

В моем веб-приложении много страниц, поэтому я не могу заставить пользователя каждый раз нажимать кнопку; но это для внутреннего использования, поэтому я могу заставить пользователей использовать Chrome и настроить эту опцию.

Ответ 3

Я знаю, что в мобильном сафари любой вызов javascript для воспроизведения() должен находиться в том же стеке вызовов, что и событие с инициативой пользователя. Подмена клика с помощью триггера javascript также не будет работать.

В моей связи 7 я могу подтвердить, что, если javascript не был вызван щелчком пользователя, он не воспроизводится.

Ответ 4

Основная проблема заключается в том, что звук (на iOS и Android) должен запускаться щелчком пользователя. Мой обходной путь был очень простым. Свяжите audio.play() со слушателем события щелчка и затем немедленно приостановите его. С этого момента и звук работает идеально.

var myAudio = new Audio('assets/myAudio.mp3');
...
button.addEventListener("click", function() {
    myAudio.play();
    myAudio.pause();
    ...
});

Ответ 5

К счастью для меня приложение html5, над которым я работаю, нужно работать только в Android 4.1, но если вы пытаетесь сделать что-то кросс-платформенное, вам нужно немного адаптировать его. Для меня не работало ни настройка громкости 0.0, ни назад, либо автовоспроизведение на элементе управления. Я также пытался приглушить, и это тоже не сработало. Тогда я подумал, что, если я установил продолжительность и только сыграю минимальную сумму файла? Здесь еще один взломанный script, который действительно работал:

function myAjaxFunction() {
  clearTimeout(rstTimer); //timer that resets the page to defaults
  var snd=document.getElementById('snd');
  snd.currentTime=snd.duration-.01; //set seek position of audio near end
  snd.play(); //play the last bit of the audio file
  snd.load(); //reload file
  document.getElementById('myDisplay').innerHTML=defaultDisplay;
  var AJAX=new XMLHttpRequest(); //won't work in old versions of IE
  sendValue=document.getElementById('myInput').value;
  AJAX.open('GET', encodeURI('action.php?val='+sendValue+'&fn=find'), true);
  AJAX.send();
  AJAX.onreadystatechange=function() {
    if (AJAX.readyState==4 && AJAX.status==200) {
      document.getElementById('myDisplay').innerHTML=AJAX.responseText;
      if (document.getElementById('err')) { //php returns <div id="err"> if fail
        rstTimer = setTimeout('reset()', 5000); //due to error reset page in 5 seconds
        snd.play(); //play error sound
        document.getElementById('myInput').value=''; //clear the input
      }
    }
  }
}

Ответ 6

Вам не нужен JavaScript для автоматического запуска, и я вижу несколько проблем в вашем коде:

<audio id="denied" preload="auto" controls="false">
    <source src="sound/denied.wav" />
</audio>

Я бы изменил его на (в HTML5 вам не нужен синтаксис атрибута = "значение" в некоторых случаях, что для XHTML):

<audio id="denied" autobuffer controls autoplay>
    <source src="sound/denied.wav" />
</audio>
<a href="#" id="play-button">play!</a>

В iOS автовоспроизведение отключено, вам нужно нажать кнопку воспроизведения или поместить событие пользователя на пользовательские элементы управления, подобные этому, с помощью JavaScript:

var audio = document.getElementById('denied');
var button = document.getElementById('play-button');
button.addEventListener('click',function(){
    audio.play();
});

или с помощью jQuery:

$('#play-button').click(function(){ audio.play(); });}

Изменить

Имейте в виду, что HTML5 - это довольно недавняя технология (по крайней мере, некоторые функции), поэтому совместимость браузера и функциональность меняются каждый раз.

Я призываю всех постоянно информировать о текущем статусе, поскольку иногда вещи становятся менее зависимыми от взлома или наоборот.

Хорошая отправная точка: http://caniuse.com/#feat=audio (проверьте вкладки внизу).

Также для глобального аудио решения я рекомендую использовать SoundManager2 JS library

Ответ 7

Вот блог-сообщение о причине и о том, как его преодолеть, загружая все аудиофайлы при первом взаимодействии с пользователем и воспроизводя их позже запрограммированным образом: https://blog.foolip.org/2014/02/10/media-playback-restrictions-in-blink/ Приняв этот подход, небольшой модуль javascript доступен на GitHub https://github.com/MauriceButler/simple-audio

Я пробовал этот простой подход самостоятельно - работал легко и просто!

Ответ 8

Это случилось со мной. Вот как я взломал это:

Я установил звук в autoplay и установил vol в 0. Когда мне это нужно, я использую метод load(), и он будет автоматически запускаться. Это легкий mp3 файл, и он воспроизводится каждый час/два часа, так что это отлично работает для меня.

Ответ 9

Я встретил ту же проблему в своем приложении. Мой сценарий использования приложений был следующим:

  • нажмите кнопку, чтобы отобразить таблицу с информацией (действие пользователя)
  • показать таблицу и обновить данные в ней с помощью AJAX
  • воспроизведение звука при изменении данных

К счастью, у меня было действие пользователя (шаг 1), поэтому я смог "инициировать" его звук, а затем воспроизвести его с помощью javascript без необходимых действий пользователя. См. Код.

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();
};

Ответ 10

попробуйте это

<audio id="denied" preload="auto" controls="false" autoplay="autoplay">
    <source src="sound/denied.wav" />
 </audio>