La lecture automatique de fichiers audio sur un iPad avec HTML5

Je vais essayer d'obtenir un fichier audio pour la lecture automatique de Safari sur l'iPad. Si je vais à la page à l'aide de Safari sur mon Mac, c'est bien. Sur l'iPad, la lecture automatique ne fonctionne pas.

Ce n'est pas une réponse, mais juste une observation. Quand j'ai mis WireShark sur ma connexion à l'iPad, j'ai remarqué que ça ne serait pas la lecture automatique, mais est toujours téléchargé le fichier Wave de toute façon. La première HTTP Get demande juste pour les 2 premiers octets du fichier, mais alors l'iPad demande pour le reste de la Vague de fichier de plus de requêtes Get. Ce qui est encore plus étrange, c'est lorsque vous cliquez sur le bouton "Jouer" de la composante Audio de l'iPad recharge le fichier Wave de nouveau.

InformationsquelleAutor milesmeow | 2010-06-09

Mise à JOUR: C'est un hack et il ne marche plus sur IOS 4.X et au-dessus. Ce un travaillé sur IOS 3.2.X.

Il n'est pas vrai. Apple ne veut pas de lecture automatique de la vidéo et l'audio sur IPad en raison de la forte quantité de trafic que vous pouvez utiliser sur les réseaux mobiles. Je ne voudrais pas utiliser l'exécution automatique pour le contenu en ligne. Hors ligne d'un site HTML c'est une grande fonctionnalité et c'est ce que je l'ai utilisé pour.

Voici une "javascript faux cliquez sur" solution: http://www.roblaplaca.com/examples/html5AutoPlay/

Copie & Collé le Code du site:

<script type="text/javascript"> 
        function fakeClick(fn) {
            var $a = $('<a href="#" id="fakeClick"></a>');
                $a.bind("click", function(e) {
                    e.preventDefault();
                    fn();
                });

            $("body").append($a);

            var evt, 
                el = $("#fakeClick").get(0);

            if (document.createEvent) {
                evt = document.createEvent("MouseEvents");
                if (evt.initMouseEvent) {
                    evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
                    el.dispatchEvent(evt);
                }
            }

            $(el).remove();
        }

        $(function() {
            var video = $("#someVideo").get(0);

            fakeClick(function() {
                video.play();
            });
        });

        </script>

Ce n'est pas ma source. J'ai trouvé ça il y a quelques temps et testé le code sur un IPad et un IPhone avec IOS 3.2.X.

Voici une autre solution: codeblog.co/getting-automatique-travail-sur-ios j'ai juste vérifié que cela fonctionne sur l'iPad avec iOS 3.2.
Ne perdez pas votre temps avec ce qu'il ne fonctionne plus avec iOS 4+

InformationsquelleAutor Fa11enAngel

104

Je tiens aussi à souligner que la raison pour laquelle vous ne pouvez pas le faire c'est une décision d'affaires que Apple a fait, pas une décision technique. À savoir, il n'y avait pas rationnel justification technique pour Apple pour désactiver le son de web apps sur l'iPod Touch. C'est un appareil WiFi uniquement, pas un téléphone qui peut engager de coûteux frais de bande passante, pour que l'argument n'a aucun mérite pour ce périphérique. Ils peuvent dire qu'ils aident avec le réseau WiFi de gestion, mais des problèmes avec la bande passante sur mon réseau WiFi est mon problème, pas d'Apple.

Aussi, si ce qu'ils se souciaient vraiment de a été contre les, excessive consommation de bande passante, ils fournissent un cadre pour permettre aux utilisateurs d'opt-in pour les applications web de sons. Aussi, ils devaient faire quelque chose pour restreindre les sites web de la consommation de l'équivalent de la bande passante par d'autres moyens. Mais il n'y a pas de telles restrictions. Un site web peut télécharger de gros fichiers en arrière-plan sur et sur et Apple ne s'intéressent pas à ce sujet. Et enfin, je crois que les sons peuvent être téléchargés de toute façon, donc PAS de bande PASSANTE EST en FAIT ENREGISTRÉ! Apple vient de ne pas leur permettre de jouer automatiquement sans interaction de l'utilisateur, les rendant inutilisables pour les jeux, ce qui est leur véritable intention.

Apple a bloqué son, parce qu'ils ont commencé à remarquer que les applications HTML5 peuvent être tout aussi capables que les applications natives, si ce n'est plus. Si vous voulez du son dans les Applications Web, vous devez hall d'Apple d'arrêter d'être anti-concurrentiel comme Microsoft. Il n'y a pas de problème technique qui peut être fixe ici.
- N'est-il pas le même pour Android?
- Jeppesen Pas. J'ai un PhoneGap/Cordova application qui a un lecteur audio et il fonctionne parfaitement sur Android. La seule raison pour laquelle j'ai atteint ce sujet ici dans StackOverflow est iOS les restrictions en matière de lecture audio.
- Maintenant, il Chrome pour Android et pour les ordinateurs de bureau ont une politique similaire à iOS
InformationsquelleAutor Rick M
28

Apple fâcheusement rejette beaucoup de HTML5 standards du web sur leurs appareils iOS, pour une variété de raisons. En fin de compte, vous ne pouvez pas pré-charge ou de l'auto-lire des fichiers audio avant un événement de touche, il ne joue qu'un seul son à la fois, et il ne prend pas en charge le format Ogg/Vorbis. Cependant, j'ai trouvé une chouette solution pour vous permettre d'avoir un peu plus de contrôle sur l'audio.
```
<audio id="soundHandle" style="display:none;"></audio>

<script type="text/javascript">

var soundHandle = document.getElementById('soundHandle');

$(document).ready(function() {
    addEventListener('touchstart', function (e) {
        soundHandle.src = 'audio.mp3';
        soundHandle.loop = true;
        soundHandle.play();
        soundHandle.pause();
    });
});

</script>
```
Fondamentalement, vous commencez à jouer le fichier audio sur le tout premier événement de touche, alors vous interrompez immédiatement. Maintenant, vous pouvez utiliser le soundHandle.play() et soundHandle.pause() commandes tout au long de votre Javascript et de contrôle de l'audio sans toucher les événements. Si vous pouvez de temps à la perfection, juste le mettre en pause viennent juste après le son est plus. Alors la prochaine fois que vous jouerez à nouveau, il va revenir au début. Cela ne va pas résoudre tous les mess Apple a fait ici, mais c'est une solution.
- Je n'ai pas essayé encore, mais si ça fonctionne vraiment, c'est génial.
- Surpris que plus de gens ne sont pas intéressés par cela.
- Est-ce encore au travail? Je peux paraître pour être en mesure d'obtenir que cela fonctionne...
- doit être accepté de répondre. Pourquoi? Il ne répond pas à la question, puisque c'est ce que l'OP demande: je vais essayer d'obtenir un fichier audio à lecture automatique Safari et cette réponse n'aide pas la lecture automatique.
InformationsquelleAutor kaleazy
23

Comme de l'iOS 4.2.1, ni le faux cliquez sur ni l' .load() astuce va travailler pour la lecture automatique de l'audio sur n'importe quel appareil iOS. La seule option que je connaisse est d'amener l'utilisateur à effectuer une action du clic et de commencer la lecture dans le gestionnaire d'événements click sans emballage de la .play() appel dans quoi que ce soit asynchrone (ajax, setTimeout, etc).

Quelqu'un s'il vous plaît dites-moi si je me trompe. J'ai eu de travail des échappatoires pour iPad et iPhone avant la plus récente mise à jour, et tous regardent comme ils ont été fermés.
- Je peux confirmer que j'ai eu le code de travail pour l'exécution automatique de l'audio sans intervention de l'utilisateur sur l'iPad et l'iPod touch, pré 4.2.1. Je viens de mettre à jour mon iPad 4.2.1 aujourd'hui (au moyen de tester mon audio preloader que ça arrive), et regardé avec horreur qu'il a simplement arrêté de fonctionner.
- Sur <video> avec 4.2.1, j'ai vérifié que tant que le .load() puis .play() venir à l'intérieur d'un synchrone cliquez/appuyez sur gestionnaire, il va fonctionner. Sinon, il échoue.
- Il semble que les programmes de contrôle des médias (audio et vidéo) des éléments est activé après l'interaction de l'utilisateur par support de l'élément. I. e. si vous avez élément audio A et B et de commencer la lecture d'Un code à l'intérieur de la portée d'un clic (ou toucher) gestionnaire d'événements, il fonctionne. Mais cela ne pas signifie, que vous pourrez ensuite commencer la lecture de B en dehors de la portée d'un gestionnaire d'événements click. Traiter les éléments multimédias dans iOS comme un singleton et swap sources sur un exemple, plutôt que de multiplier les instances par les sources.
InformationsquelleAutor David Gouldin
9

Je confirme que l'audio ne fonctionne pas comme décrit (au moins sur iPad exécutant 4.3.5). La question spécifique de l'est de l'audio ne se charge pas dans une méthode asynchrone (ajax, événement timer, etc) mais il jouera s'il a été préchargé. Le problème est la charge doit être sur un déclenchées par l'utilisateur de l'événement. Donc, si vous pouvez avoir un bouton permettant à l'utilisateur de lancer la lecture, vous pouvez faire quelque chose comme:
```
function initSounds() {
    window.sounds = new Object();
    var sound = new Audio('assets/sounds/clap.mp3');
    sound.load();
    window.sounds['clap.mp3'] = sound;
}
```
Alors à jouer, par exemple, dans une requête ajax, vous pouvez le faire
```
function doSomething() {
    $.post('testReply.php',function(data){
        window.sounds['clap.mp3'].play();
    }); 
}
```
Pas la plus grande solution, mais il peut aider, surtout en sachant que le coupable est la fonction de charge dans un non-utilisateur-événement déclenché.

Edit: j'ai trouvé d'Apple explication, et elle affecte iOS 4+:
http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html
- C'est de l'Or de réponse. Vous pouvez remplir les sons de l'objet avec plusieurs sons. Et après appel ajax sur la réussite/cas d'erreur de jouer tout ce que vous voulez. Fonctionne pour moi sur tous les appareils! Big tnx!!!
InformationsquelleAutor Jacob Mouka
7

Essayez d'appeler le .la méthode load() avant de l' .méthode play() sur l'audio ou de la vidéo tag... qui sera HTMLAudioElement ou HTMLVideoElement respectivement. C'était la seule façon dont il pourrait fonctionner sur l'iPad pour moi!
- pourriez-vous expliquer comment cela fonctionne
- Selon le site apple developer documents ni .charge ni .le jeu se de travail, sauf lorsqu'il est déclenché par un utilisateur.
InformationsquelleAutor Brian Brown
5

De lecture automatique ne fonctionne pas sur iPad ou iPhone pour la vidéo ou de l'audio tags. C'est une restriction mise en place par Apple pour enregistrer les utilisateurs de la bande passante.

InformationsquelleAutor Andrew
5

Il me semble que la réponse à cette question est (au moins maintenant) clairement documenté sur le Safari HTML5 docs:

De Contrôle de l'utilisateur de Téléchargements Sur les Réseaux Cellulaires

Dans Safari sur iOS (pour tous les appareils, y compris iPad), où l'utilisateur peut être sur un réseau cellulaire, et facturés par unité de données, de précontrainte et de la lecture automatique sont désactivées. Aucune donnée n'est chargé jusqu'à ce que l'utilisateur lance il en. Cela signifie que le JavaScript play() et les méthodes load() sont également inactif jusqu'à ce que l'utilisateur procède à la lecture, à moins que le play() ou la méthode load() est déclenchée par l'action de l'utilisateur. En d'autres termes, une initiative de l'utilisateur bouton de lecture des œuvres, mais onLoad="play()" ne.

Ce joue le film: <input type="button" value="Play" onClick="document.myMovie.play()">

Cela ne veut rien sur iOS: <body onLoad="document.myMovie.play()">

InformationsquelleAutor Adrian
2

Ont perplexe sur ce, tout en développant un prototype rapide web app sous iOS4.2 (dev build). La Solution est en fait assez simple. Notez que vous ne pouvez pas semblent déjà avoir la balise dans votre page HTML, vous devez insérer la balise dans le document de manière dynamique (remarque: cet exemple utilise Prototype de 1,7 pour un peu de Javascript snazziness):
```
this.soundFile = new Element("audio", {id: "audio-1", src: "audio-1.mp3", controls: ""});
document.body.appendChild(this.soundFile);
this.soundFile.load();
this.soundFile.play();
```
Que vous n'avez pas défini un contrôleur, il ne devrait pas y avoir besoin de faire quelque chose tricksy avec CSS pour masquer /position de hors-écran.

Cela semble fonctionner parfaitement.

InformationsquelleAutor Jon Jardine
2

Apple ne prend pas en charge la norme complètement, mais il existe une solution de contournement. Leur justification est un réseau cellulaire de la congestion, peut-être parce que vous atterrissez sur les pages de jouer random audio. Ce comportement ne change pas lorsque l'appareil passe sur le wifi, peut-être pour des raisons de cohérence. Par ailleurs, ces pages sont généralement une mauvaise idée de toute façon. Vous ne devriez pas être en train d'essayer de mettre une bande sur chaque page web. C'est tout simplement faux. 🙂

audio html5 va jouer si il est lancé comme le résultat d'une action de l'utilisateur. Le chargement d'une page ne comptent pas. Si vous avez besoin de restructurer votre application web pour être un tout-en-un-page app. Au lieu d'un lien qui ouvre une page qui joue audio, vous avez besoin de ce lien pour le lire sur la page en cours, sans un changement de page. Cette "interaction de l'utilisateur" règle s'applique à l'html5 méthodes que vous pouvez appeler sur un fichier audio ou vidéo de l'élément. Les appels de retour sans aucun effet si elles sont alimentées automatiquement au chargement de la page, mais lorsqu'ils sont appelés à partir de gestionnaires d'événements.

InformationsquelleAutor bmidgley
1

Ma solution est de déclenchement à partir d'un contact réel événement dans un menu précédent. Ils ne vous force pas à utiliser une interface de lecteur de cours. Pour ma part, cela fonctionne bien. Si vous ne disposez pas d'un interface à utiliser, autant que je sache, vous êtes enculer. Peut-être que vous pourriez essayer de l'inclinaison des événements ou quelque chose...

InformationsquelleAutor Luke Stanley
1

Si vous créez un élément Audio à l'aide de:
```
var a = new Audio("my_audio_file.wav");
```
Et ajouter un suspend écouteur d'événement via:
```
a.addEventListener("suspend", function () {console.log('suspended')}, false);
```
Et puis charger le fichier dans le navigateur Safari mobile (iPad ou iPhone), vous verrez le "suspendu" se connecté à la console développeur. Selon la spec HTML5, ce qui signifie, "l'agent de L'utilisateur est intentionnellement pas actuellement l'extraction de données des médias, mais ne dispose pas de l'ensemble de ressources multimédia téléchargés."

L'appel d'une suite un.load(), le test de la "en jeu" de l'événement, puis à l'aide d'un.play() semble être une méthode appropriée pour l'auto déclencher le son.
- J'ai essayé ceci mais ça ne semble pas fonctionner. Toute mise à jour? sandbox.coolaj86.info/html5-audio-tag-ios4.html
InformationsquelleAutor Vince
0

Fonctionne avec jQuery, testé sur Ipad, v. 5.1.1
```
$('video').get(0).play();
```
Vous avez à ajouter/supprimer l'élément vidéo à partir de la page.
- Ne fonctionne pas sur iPad 1 iOS 5.1.1 ... bien qu'il ne fonctionne sur iPod 6.0 et iPhone
InformationsquelleAutor Adrian

J'ai traité ce par la fixation d'un gestionnaire d'événements pour tous les événements pour lesquels vous êtes autorisé à déclencher un signal audio de l'élément de corps qui déclenche tout code html des éléments audio avec la lecture automatique à jouer une fois.

var mobile = /iPad|iPhone|iPod|android/.test(navigator.userAgent) && !window.MSStream;
if (mobile) {
    $('body').on('touchstart click doubleclick keydown', function() {
        $("audio[autoplay='autoplay']").each(
            function(){
                this.play();
                this.removeAttribute('autoplay');
            });
    });
}

InformationsquelleAutor Andrew Hancox

Cela semble fonctionner:

<html>
<title>
iPad Sound Test  - Auto Play
</title>
</head>
<body>
<audio id="audio" src="mp3test.mp3" controls="controls" loop="loop">
</audio>
<script type="text/javascript"> 
    window.onload = function() {
        var audioPlayer = document.getElementById("audio");
        audioPlayer.load();
        audioPlayer.play();
    };
    </script> 

</body>
</html>

Le voir en action ici: http://www.johncoles.co.uk/ipad/test/1.html (Archivé)

Comme de l'iOS 4.2, ce ne sont plus des œuvres. Désolé.

Me semble que le fichier mp3 n'est pas archivé, donc cela le lien archives modifier est tout à fait discutable.
Il y a un mp3 lien? J'ai manqué. Merci.

InformationsquelleAutor John Coles

Vous devez vous connecter pour publier un commentaire.