Автовоспроизведение аудио в мобильном сафари

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

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

1. Вам НЕОБХОДИМО взаимодействие с пользователем, чтобы запустить звук. Итак, ваше приложение или игра может иметь начальный экран или кнопку приветствия, которую нужно щелкнуть, чтобы перейти в главное меню или запустить игру. Привяжите к пользовательскому событию (допустимые события: «щелчок», «касание», «двойной щелчок» и «нажатие клавиши») и вызовите метод load() для вашего <audio>.

2. Привяжите к событию canplaythrough файла <audio>. Это событие запускается, когда ваш источник готов к воспроизведению. Теперь вы можете вызывать play(), pause() или ждать других взаимодействий. Итак, звук готов, но теперь у вас есть полный контроль, когда включать или выключать звук.

3. Также советую использовать аудио спрайты на мобильных клиентах. iOS (и Android?) внутренне реализовала поддержку звука через Singleton. Это означает, что вы не можете, как в настольном браузере, иметь 10 аудиоэлементов и одновременно воспроизводить разные звуки. Вы можете воспроизвести только один файл! Поэтому смена источника для разных звуков занимает много времени. С помощью звукового спрайта вы можете запускать свои спрайты, когда пользователь впервые взаимодействует с вашим веб-сайтом или игрой. Приостановите свой спрайт, и когда вам нужно воспроизвести звук, вы должны установить currentTime в начало спрайта и приостановить спрайт, когда currentTime вашего файла достигнет конца вашего спрайта. Существует событие timeupdate, где вы можете проверить текущее время вашего спрайта.

Если вам больше интересно, я могу подготовить для вас свой проигрыватель аудиоспрайтов javascript !!

Единственное решение, которое я видел до сих пор, — это создать приложение-оболочку и поместить веб-приложение в UIWebView.

http://flowz.com/2011/03/apple-disabled-audiovideo-playback-in-html5/

UIWebView.allowsInlineMediaPlayback = YES;
UIWebView.mediaPlaybackRequiresUserAction = NO;

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

Я считаю, что я только что решил это для своего собственного приложения.

Шаги,

Контроллер загружается,

Затем .... в представленииDidLoad

пусть ваше веб-представление загрузит HTML: loadHTMLString:htmlFile baseURL:[self getBasePath]];

ТОГДА... установите mediaPlaybackRequiresUserAction = NO в веб-просмотре.

Если вы установите его слишком рано, я думаю, что загрузка для html сбрасывает его.

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

просто прикрепите прослушиватель событий кликов к документу и вызовите player.load(), после чего всякий раз, когда вы устанавливаете player.src = x;, он будет воспроизводиться автоматически.

<audio id="voicePlayer" controls autoplay playsinline #voicePlayer></audio>

@ViewChild('voicePlayer', { read: ViewContainerRef }) voicePlayerRef: ViewContainerRef;

...

  ngAfterContentInit(): void {
    this.voicePlayer = this.voicePlayerRef.element.nativeElement;
    document.addEventListener('click', this._onDocumentClick.bind(this));
  }

  _onDocumentClick() {
    this.voicePlayer.load();
    document.removeEventListener('click', this._onDocumentClick);
  }

...


this.voicePlayer.src = 'x';