Pourquoi Safari sur iOS n'est pas montrer ma vidéo HTML5 affiche?
J'ai cette page:
http://healthpad.net/dashboard/
Il ont 10 <video>
éléments sur elle.
Pour une raison quelconque, lorsque je charge la page sur un iPad, ce n'est pas montrer une vidéo d'affiches.
Essayez ce qui suit:
- charger la page sur un navigateur de bureau
- le charger sur un iPad ou un iPad simulateur, et vous obtenez une grosse boîte noire avec un bouton de lecture
s'il vous plaît dites-moi pourquoi ce qui se passe?
Voici ce que j'ai déjà écarté:
Image-tête Content-Type.
J'ai validé le fait que le contenu de l'image-type de l'en-tête est correctement défini.
Dans l'exemple ci-dessus, le Content-Type
en-tête correctement image/jpeg
.
Interférence avec l'video.js bibliothèque
VideoJs est utilisé pour montrer que le beau bouton de lecture sur les navigateurs de bureau et de personnaliser les contrôles. Cette bibliothèque n'interfère pas avec le lecteur natif cependant.
Juste pour être sûr, j'ai créé une vidéo test de la page qui n'a pas la vidéo-js classe, afin que la bibliothèque ne possède pas les ramasser et les processus de cette vidéo. En fait, la page de test ne comprend même pas toute bibliothèque JS, c'est juste
<html><body>
<video
controls
height="400"
width="600"
poster="http://healthpad.net/media/CACHE/images/uploads/video_poster_1414/bd5fba5a68ddd0f4b3f61193f6908962.jpg"
src="http://healthpad.net/media/uploads/video_processed_720p_1414.mp4"
></video>
</body></html>
http://healthpad.net/rj_templates/test/zzz/
L'utilisation de n'importe quelle vidéo attributs qui ne peuvent pas être pris en charge sur le navigateur Safari Mobile
La page de test ci-dessus a juste une simple balise vidéo. J'ai essayé de supprimer tous les autres attributs, sauf pour src
et poster
, il n'a pas aidé.
La plupart des StackOverflow questions sur le sujet il suffit de dire "Redémarrer votre iPad"
Voici où ça devient bizarre:
Si vous avez autour de google sur ce point, les réponses sur StackOverflow qui ont été acceptés souvent dire "Redémarrer votre iPad, qu'il a fait pour moi".
J'ai donc essayé de faire la même chose, au début, j'ai juste dit que ça ne fonctionne pas dans mon cas.
Ensuite, j'ai essayé ceci:
(toutes les opérations suivantes sur l'iPad simulateur)
- Aller sur le site, affiches vidéo ne montre pas
- Aller à la page de test (http://healthpad.net/rj_templates/test/zzz/), la vidéo affiche ne montre pas.
- Cliquez sur la maison pour la sortie de Safari (ou Cmd+Maj+H mac le raccourci pour le simulateur)
- Double-Cliquez sur le bouton de la maison pour obtenir le task switcher en dehors de Safari, touchez et maintenez sur l'icône de safari jusqu'à la tuer bouton de la montre.
- Tuer Safari
- Ouvrez safari (redémarrage). À ce stade, si vous chargez la page de test (celui avec une seule vidéo), l'affiche va le montrer.
- Maintenant, allez à la multi-page vidéo: (http://healthpad.net/dashboard/). Affiches vidéo ne montre pas.
- Revenir à la seule vidéo de test de la page, la vidéo affiche pour que l'un ne fonctionne plus non plus.
- Répétez les étapes 3 à 8 pour voir le processus de la vidéo affiches d'arrêt de travail.
Donc, apparemment, à un certain point, le navigateur Safari Mobile décide de ne plus montrer une vidéo d'affiches.
Aussi, apparemment, mon site déclencheurs de cette condition.
Précisions:
Quand les affiches ne fonctionnent plus, il n'est pas seulement se produire sur un domaine, pas de vidéo, des affiches seront chargés pour tout autre site, indépendamment de savoir si ou non il est sur un tout autre domaine (par exemple, la vidéo de démo de http://www.videojs.com/).
Afin de réinitialiser ce comportement, de ce que j'ai vu, vous devez arrêter et redémarrer Safari. Juste la fermeture et la réouverture il n'est pas réinitialisé cet état.
Quelqu'un a une idée pourquoi ce qui se passe? Est-il un moyen de le contourner?
- Donc, vous voyez le problème avec la plaine de la balise vidéo de trop, ou est-ce uniquement lors de l'utilisation de video.js? Aussi quelle version de video.js et quelle version d'iOS?
- Il arrive à la plaine des balises vidéo trop, même lorsque videojs n'est pas présent.
Vous devez vous connecter pour publier un commentaire.
J'ai eu ce travail à l'aide d'un PNG à la place d'un JPG.
Chose étrange est, le JPG travaillé dans iOS Safari localement (via un POW serveur local wifi), mais quand on le pousse à la mise en scène de l'affiche de l'image ne se charge pas. À la fois le local et la mise en scène de code de référence le même fichier sur S3.
Changé le format de fichier PNG et il charge très bien.
Je vois la question ne cesse de se upvoted une fois dans un certain temps, mais il n'y a pas de réponse.
Alors, voici ce que j'ai fait:
Sur iOS, au lieu de montrer le lecteur vidéo (même avec
autoload=false
), je vais juste vous montrer l'affiche et le bouton de lecture, deux autonome<img>
balises.Quand ils obtiennent cliqué, j'ai créer le lecteur vidéo à partir de javascript et demander à jouer. Fonctionne très bien, les utilisateurs ne vois pas beaucoup de différence.
<img>
balise avec un événement click qui crée le lecteur vidéo. La vidéo n'est pas une option pour le fermer, lorsque l'utilisateur interagit alors avec elle, c'est l'interaction avec le natif safari joueur dans le cas d'iOS.Dans Safari paramètres [iOS7] Bloquer les Pop-Ups est sur "OFF" semblait pour remédier à cela pour moi, espérons que cette aide.