Salut,
Je te remercie pour ta réponse.
Effectivement il y a bien le player par défaut des navigateur avec le HTML5.
Pour l'auto switcher il y a ce script :
https://hls-js.netlify.app/demo/
Donc la on va me dire, ok j'ai la solution à mon problème tout est ok.
Le soucis c'est que c'est compatible a peu pret sur toute plateforme
SAUF
sur ios
Il y a bien pourtant une portion du script sur la page de démo qui parle de ce problème sur ios, avec semble t-il une solution, seuf que la solution ne fonctionne tout simplement pas sur mon iphone ios 13 safari: "your broswer does not support mediasource extension".
Citation :
// hls.js is not supported on platforms that do not have Media Source Extensions (MSE) enabled.
// When the browser has built-in HLS support (check using `canPlayType`), we can provide an HLS manifest (i.e. .m3u8 URL) directly to the video element through the `src` property.
// This is using the built-in support of the plain video element, without using hls.js.
// Note: it would be more normal to wait on the 'canplay' event below however on Safari (where you are most likely to find built-in HLS support) the video.src URL must be on the user-driven
// white-list before a 'canplay' event will be emitted; the last video event that can be reliably listened-for when the URL is not on the white-list is 'loadedmetadata'.
|
Code :
- <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
- <!-- Or if you want a more recent canary version -->
- <!-- <script src="https://cdn.jsdelivr.net/npm/hls.js@canary"></script> -->
- <video id="video"></video>
- <script>
- var video = document.getElementById('video');
- if (Hls.isSupported()) {
- var hls = new Hls();
- hls.loadSource('https://video-dev.github.io/streams/x36xhzz/x36xhzz.m3u8');
- hls.attachMedia(video);
- hls.on(Hls.Events.MANIFEST_PARSED, function() {
- video.play();
- });
- }
- // hls.js is not supported on platforms that do not have Media Source Extensions (MSE) enabled.
- // When the browser has built-in HLS support (check using `canPlayType`), we can provide an HLS manifest (i.e. .m3u8 URL) directly to the video element through the `src` property.
- // This is using the built-in support of the plain video element, without using hls.js.
- // Note: it would be more normal to wait on the 'canplay' event below however on Safari (where you are most likely to find built-in HLS support) the video.src URL must be on the user-driven
- // white-list before a 'canplay' event will be emitted; the last video event that can be reliably listened-for when the URL is not on the white-list is 'loadedmetadata'.
- else if (video.canPlayType('application/vnd.apple.mpegurl')) {
- video.src = 'https://video-dev.github.io/streams/x36xhzz/x36xhzz.m3u8';
- video.addEventListener('loadedmetadata', function() {
- video.play();
- });
- }
- </script>
|
Chez moi, sur mon iphone la vidéo ne se lance pas sur la démo.
D'après mes tests le fallback ne fonctionne pas. Cette partie la :
Code :
- else if (video.canPlayType('application/vnd.apple.mpegurl')) {
|
Message édité par Stellvia_fr le 21-11-2020 à 10:54:26