web-dev-qa-db-fra.com

Lecture automatique audio sur safari mobile

Avant d'être flambé à mort, je sais que cela ne fonctionne pas actuellement en raison des inquiétudes d'Apple concernant le coût terrifiant pour leurs utilisateurs de télécharger automatiquement un fichier audio (rien à voir avec le fait qu'ils essaient de paralyser les applications Web car ils n'obtiennent pas leur 30% d'entre eux).

Cependant, ma question est: quelqu'un a-t-il déjà trouvé une solution de contournement astucieuse? Je veux juste jouer un son de démarrage au lancement d'un jeu et je dois actuellement attendre que l'utilisateur clique quelque part avant de pouvoir lire l'audio. L'un de vous, des gars intelligents, a dû faire fonctionner ça maintenant?

htmlaudiomobile-safariautoplay
16
Simple Simon

Il n'y a aucune chance de faire fonctionner automatiquement la lecture automatique dans les navigateurs mobiles. Android et iOS ne le permettent pas et personnellement, je pense que c'est un confinement faisable! Imaginez chaque deuxième site Web que vous ouvrirez des jeux et un son laid au début!

Mais vous pouvez faire un petit hack, afin que l'utilisateur ne remarque pas qu'il a actuellement démarré l'audio pour votre application:

  1. Vous aurez besoin d'une interaction utilisateur pour démarrer votre audio. Ainsi, votre application ou votre jeu possède peut-être un écran de démarrage ou un bouton de bienvenue qui nécessite un clic pour accéder au menu principal ou démarrer le jeu. Lier à un événement utilisateur (les événements acceptés sont: "cliquer", "toucher", "double-cliquer" et "keydown") et appeler la méthode load () pour votre <audio>.

  2. Lier à l'événement "canplaythrough" de <audio>. Cet événement est déclenché lorsque votre source est prête à jouer. Ici, vous pouvez maintenant appeler play (), pause () ou attendre d'autres interactions. L'audio est donc prêt, mais vous avez maintenant un contrôle total sur le démarrage ou l'arrêt du son.

  3. Je vous conseille également d'utiliser des sprites audio sur les clients mobiles. Prise en charge audio iOS (et Android?) mise en œuvre en interne via un Singleton. Cela signifie que vous ne pouvez pas, comme dans le navigateur de bureau, avoir 10 éléments audio et jouer différents sons à la fois. Vous ne pouvez lire qu'un seul fichier! Changer la source de différents sons prend donc beaucoup de temps. Avec un Sprite audio, vous pouvez démarrer vos sprites lorsque l'utilisateur interagit pour la première fois avec votre site Web ou votre jeu. Mettez votre Sprite en pause et lorsque vous avez besoin de jouer du son, vous devez régler le currentTime au début du Sprite et mettre le Sprite en pause lorsque le currentTime de votre fichier atteint la fin de votre Sprite. Il y a un événement de mise à jour où vous pouvez vérifier l'heure actuelle de votre Sprite.

Si vous êtes plus intéressé, je peux préparer mon lecteur de sprites audio javascript pour vous !!

14
Simon Franzen

La seule solution que j'ai vue jusqu'à présent est de créer une application Shell et de placer l'application Web dans une UIWebView.

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

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

J'aimerais aussi vraiment savoir comment faire cela dans une application Web ancienne.

4
Jason

Je crois que je viens de résoudre ce problème pour ma propre application.

Les marches,

Le contrôleur se charge,

Puis .... dans viewDidLoad

demandez à votre vue Web de charger le HTML: loadHTMLString: htmlFile baseURL: [self getBasePath]];

ALORS ... définissez mediaPlaybackRequiresUserAction = NO sur la vue Web.

Si vous le définissez trop tôt, je pense que la charge pour le html le réinitialise.

0
user3799852

J'ai une application de chat bot qui a des messages vocaux et j'avais besoin qu'ils soient lus automatiquement chaque fois que nécessaire ... alors voici ce qui a fonctionné pour moi dans mon angular application:

il suffit d'attacher un écouteur d'événements click au document et d'appeler player.load(), après cela chaque fois que vous définissez player.src = x; il s'exécutera automatiquement.

<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';
0
Exlord