Как сделать автозапуск аудио на хром

Question

автозапуск аудио работает в Mozilla, Microsoft Edge и старом Google Chrome, но не в новом Google Chrome.они заблокировали автовоспроизведение.Есть ли способ сделать это автозапуск аудио в Google Chrome?

Answer 1

Решение без использования iframe или javascript:

<embed src="silence.mp3" type="audio/mp3" autostart="true" hidden="true">
        <audio id="player" autoplay controls><source src="source/audio.mp3" type="audio/mp3"></audio>

В этом решении также отсутствует диалог открытия / сохранения в Internet Explorer.

   <embed src="http://deinesv.cf/silence.mp3" type="audio/mp3" autostart="true" hidden="true">
        <audio id="player" autoplay controls><source src="https://freemusicarchive.org/file/music/ccCommunity/Mild_Wild/a_Alright_Okay_b_See_Through/Mild_Wild_-_Alright_Okay.mp3" type="audio/mp3"></audio>

Answer 2

Атрибут автозапуска HTML5 audio по умолчанию не работает в Chrome, но вы можете включить автозапуск аудио с помощью JavaScript.Попробуйте это:

document.getElementById('myAudio').play();

Это работает для меня.

Answer 3

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

В любом случае, я ушел от этого:

<iframe src="silence.mp3" allow="autoplay" id="audio" style="display:none"></iframe>
<audio id="audio" autoplay>
  <source src="helloworld.mp3">
</audio>

Это:

<audio id="myAudio" src="helloworld.mp3"></audio>
<script type="text/javascript">
  document.getElementById("myAudio").play();
</script>

И, наконец, это «решение», которое несколько выходит за рамки, если вы просто хотите создать свою собственную вещь (что мы делаем):

<script src='https://code.responsivevoice.org/responsivevoice.js'></script>
<input onclick='responsiveVoice.speak("Hello World");' type='button' value='Play' />

Открытие, которое я сделал, а также по-настоящему забавная (странная? Странная? Смешная?) Часть состоит в том, что в случае с первыми двумя вы можете на самом деле победить систему, дав f5 правильное удары;если вы нажмете на обновление очень быстро (примерно 5-10 раз должно сработать), звук будет воспроизводиться автоматически, а затем он будет проигрываться несколько раз при обновлении сингла, только чтобы вернуться к злым путям.Фантастика!

В объявлении от Google говорится, что для того, чтобы медиа-файлы воспроизводились «автоматически», должно происходить взаимодействие между пользователем и сайтом.Поэтому лучшее «решение», которое мне удалось найти, - это добавить кнопку, которая сделает воспроизведение файлов менее автоматическим, но более стабильным / надежным.

Answer 4

temp fix

$(document).on('click', "#buttonStarter", function(evt)
{
var context = new AudioContext();
document.getElementById('audioPlayer').play();
$("#buttonStarter").hide()
$("#Game").show()
});

Или используйте пользовательский проигрыватель для запуска воспроизведения http://zohararad.github.io/audio5js/

Примечание: автоигра будет возобновлена ​​31 декабря

Answer 5

Я добавляю атрибут управления, тоже помечаю аудио, и просто скрываю его в CSS.И все отлично работает в Chrome.

<audio autoplay loop controls id="playAudio">
  <source src="audio/source.mp3">
</audio>

Answer 6

Существует действительно изящный прием использования функции автозапуска аудиотега в chrome.

Добавить

<iframe src="silence.mp3" allow="autoplay" id="audio"></iframe>

, тогда как silence.mp3 - это только 0,5 секунды тишины.

Этот

<audio id="player" autoplay controls><source src="0.mp3" type="audio/mp3"></audio>

работает впоследствии.

Chrome замечает, что звук был воспроизведен, и дает разрешение на автоматическое воспроизведение в аудиотэгах.

Посмотретьв действии: http://deinesv.cf/

Answer 7

Используйте iframe вместо:

<iframe id="stream" src="YOUTSOURCEAUDIOORVIDEOHERE" frameborder="0"></iframe>

Answer 8

Решение № 1

Мое решение здесь - создать теги iframe

<iframe src="audio/source.mp3" allow="autoplay" style="display:none" id="iframeAudio">
</iframe> 

и audio, а также для нехромных браузеров

<audio autoplay loop  id="playAudio">
      <source src="audio/source.mp3">
    </audio>

и в моем script

  var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
    if(!isChrome){
      $('#iframeAudio').remove()
    }
  else{
     $('#playAudio').remove() //just to make sure that it will not have 2x audio in the background 
  }

Решение № 2:

Есть еще один обходной путь для этого, согласно @ Leonard

Создайте iframe, который ничего не воспроизводит, только для запуска автозапуска при первой загрузке.

<iframe src="silence.mp3" allow="autoplay" id="audio" style="display:none"></iframe>

хороший источник для mp3-файла silence.mp3

Тогда играйте в свой настоящий аудио файл в покое.

<audio id="player" autoplay loop>
    <source src="audio/source.mp3" type="audio/mp3">
</audio>

Лично я предпочитаю решение # 2 , потому что это более чистый подход, чтобы не полагатьсятак много в JavaScript.

Answer 9

Просто добавьте этот небольшой скрипт, как показано в https://developers.google.com/web/updates/2017/09/autoplay-policy-changes#webaudio

<head>
<script>
window.onload = function() {
  var context = new AudioContext();
}
</script>
</head>

Чем это будет работать, как вы хотите:

<audio autoplay>
      <source src="hal_9000_sorry_dave.mp3">
</audio>

Answer 10

Я использовал pixi.js и pixi-sound.js для автоматического воспроизведения в Chrome и Firefox.

<script>

            PIXI.sound.Sound.from({
            url: 'audios/tuto.mp3',
            loop:true,
            preload: true,
            loaded: function(err, sound) {
                    sound.play();

            document.querySelector("#paused").addEventListener('click', function() {
            const paused = PIXI.sound.togglePauseAll();

            this.className = this.className.replace(/\b(on|off)/g, '');
            this.className += paused ? 'on' : 'off';

            });
            }
            });

</script>

HTML:

<button class="btn1 btn-lg off" id="paused">
    <span class="glyphicon glyphicon-pause off"></span>
    <span class="glyphicon glyphicon-play on"></span>
</button>

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