Lecture de fichiers audio sur l'iPad

Question

Je travaille sur un site web qui comporte un chat pour un client, mais nous rencontrons des problèmes avec l'audio sur l'iPad (iOS 5).

La cible est en fait l'iPad avec le support d'IE7 est préféré.

J'ai essayé ces approches :

HTML5

<audio id="notification" preload="auto">
    <source src="audio/notification.ogg" type="audio/ogg" />
    <source src="audio/notification.mp3" type="audio/mpeg" />
</audio>

Avec un peu de javascript

var el = document.getElementById('notification');
el.play();

---

Une fonction javascript J'ai volé quelque part qui sont en fait deux méthodes différentes dans une seule fonction. Veuillez noter que le script est dans un sous-répertoire, donc le chemin est correct.

function notify() {
    var url = '../audio/notification.mp3';
    var a = document.createElement('audio');

    if(!!(a.canPlayType && a.canPlayType('audio/mpeg').replace(/no/, ''))) {
        var sound = new Audio(url);
        sound.load();
        sound.play();
    } else {
        $('#notification').remove();
        var sound = $('<embed id="notification" type="audio/mpeg" src="'+url+'" loop="false" hidden="true" autostart="true" />');
        $(body).append(sound);
    }
}

Les deux méthodes ne semblent pas fonctionner. Est-ce que je fais quelque chose de mal ?

Answer 1

Eh bien, la réponse était assez évidente.

Après avoir passé beaucoup de temps à faire des recherches, etc. un article dans la documentation officielle de Safari disant :

Dans Safari sous iOS (pour tous les appareils, y compris l'iPad), où l'utilisateur peut se trouver sur un réseau cellulaire et être facturé par unité de données, le préchargement et la lecture automatique sont désactivés. Aucune donnée n'est chargée tant que l'utilisateur n'en prend pas l'initiative. Cela signifie que les méthodes JavaScript play() et load() sont également inactives jusqu'à ce que l'utilisateur lance la lecture, à moins que la méthode play() ou load() ne soit déclenchée par une action de l'utilisateur. En d'autres termes, un bouton Play initié par l'utilisateur fonctionne, mais un événement onLoad="play()" ne fonctionne pas.

Donc, en gros, vous ne pouvez pas lancer un son sans que l'utilisateur le déclenche au préalable. Comme solution, j'ai créé un bouton de sourdine qui est désactivé par défaut, de sorte que vous devez cliquer dessus, ce qui déclenche le son de la notification. Ensuite, je peux utiliser Javascript pour jouer le son sans interaction avec l'utilisateur.

Merci à Safari pour ce grand avenir. Merci beaucoup.

Answer 2

Avec la sortie de iOS 6 pour l'iPad, la lecture audio pendant un onLoad n'est toujours pas prise en charge pour l'iPad.

Pour les iPhones avec iOS 6, l'audio ne sera lu pendant le onLoad d'un site html que si des écouteurs sont branchés dans la prise audio de l'iPhone.

Answer 3

L'iPad d'Apple ne permet pas de jouer des sons sans qu'un clic de l'utilisateur l'ait préalablement initié.

Solution : Ajouter un bouton de lecture/pause.

App.toggle_audio = function(elem) {
  var icon = elem.find("i");
  var playing = _.include(icon.attr('class').split(" "), "icon-pause")
  if (playing) {
    elem.html("<i class='icon-play'></i> " + App.translate_play_audio);
    App.play_audio_toggle = false;
  } else {
    App.audio_file.load();
    elem.html("<i class='icon-pause'></i> " + App.translate_pause_audio);
    App.play_audio_toggle = true;
  }
}

Une fois que l'utilisateur a cliqué sur le bouton, l'audio est chargé. Vous pouvez alors le lire via Javascript.

  if (App.play_audio_toggle) {
    App.audio_file.play();
  }

Answer 4

Code source (version simple)

HTML

 <div id="enableSound"> Enable Sound</div>

JS

var sound = new Audio("/Assets/audio/yourAudio.mp3");;
 $("#enableSound").click(function() {
     sound.play();
  });

L'utilisateur doit cliquer sur la div "#enableSound", à partir de ce moment, chaque fois que vous voulez jouer le son ci-dessus, il suffit d'appeler

sound.play()

http://jsbin.com/virixukavo/1/edit?html,js,output

Answer 5

Essayez de mettre le MP3 comme première source plutôt que comme deuxième. L'iPad avait un problème où il lisait toujours la première source, quoi qu'il arrive (ce problème a peut-être été résolu depuis, mais ça vaut la peine d'essayer).

Essayez également de modifier le type a audio/mp3 .