如何在不同的浏览器和不同的操作系统上精确检测HLS支持？

根据this的回答，为了测试浏览器播放HLS视频的能力，可以使用MIME application/x-mpegURL。但是，这种方法的问题是，它为iPhone（实际上支持HLS）以及适用于Android的Firefox（不支持）返回maybe。尽管在Chrome和Firefox等桌面浏览器的情况下，返回空字符串效果很好。如何在不同的浏览器和不同的操作系统上精确检测HLS支持？

是否有任何确切的方法来检查浏览器中的HLS支持？

HTML5test.com能够准确地预测HLS支持是“是”还是“否”。这是如何工作的？

来源

2016-10-14 Ram

HTML5test.com正在做或ARENT？你最后的陈述有点模糊。 – Liam

@Ram你有没有试过在'

@ guest271314不！你能详细说明一下吗？ – Ram

HTML5test.com能够精确地预测HLS支持，因为是的或No.这是如何工作的？

在在链接页面的源代码见engine.js在行2405-2533其中HTMLMediaElement.canPlayType()使用

/* video element */ 

    function (results) { 
     var element = document.createElement('video'); 

     results.addItem({ 
      key: 'video.element', 
      passed: !!element.canPlayType 
     }); 


     /* audioTracks property */ 

     results.addItem({ 
      key: 'video.audiotracks', 
      passed: 'audioTracks' in element 
     }); 


     /* videoTracks property */ 

     results.addItem({ 
      key: 'video.videotracks', 
      passed: 'videoTracks' in element 
     }); 


     /* subtitles */ 

     results.addItem({ 
      key: 'video.subtitle', 
      passed: 'track' in document.createElement('track') 
     }); 


     /* poster */ 

     results.addItem({ 
      key: 'video.poster', 
      passed: 'poster' in element 
     }); 
    }, 


    /* video codecs */ 

    function (results) { 
     var element = document.createElement('video'); 

     /* mpeg-4 codec */ 

     results.addItem({ 
      key: 'video.codecs.mp4.mpeg4', 
      passed: !!element.canPlayType && canPlayType(element, 'video/mp4; codecs="mp4v.20.8"') 
     }); 

     /* h.264 codec */ 

     /* I added a workaround for IE9, which only detects H.264 if you also provide an audio codec. Bug filed @ connect.microsoft.com */ 

     results.addItem({ 
      key: 'video.codecs.mp4.h264', 
      passed: !!element.canPlayType && (canPlayType(element, 'video/mp4; codecs="avc1.42E01E"') || canPlayType(element, 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"')) 
     }); 

     /* h.265 codec */ 

     results.addItem({ 
      key: 'video.codecs.mp4.h265', 
      passed: !!element.canPlayType && (canPlayType(element, 'video/mp4; codecs="hvc1.1.L0.0"') || canPlayType(element, 'video/mp4; codecs="hev1.1.L0.0"')) 
     }); 

     /* theora codec */ 

     results.addItem({ 
      key: 'video.codecs.ogg.theora', 
      passed: !!element.canPlayType && canPlayType(element, 'video/ogg; codecs="theora"') 
     }); 

     /* vp8 in webm codec */ 

     results.addItem({ 
      key: 'video.codecs.webm.vp8', 
      passed: !!element.canPlayType && canPlayType(element, 'video/webm; codecs="vp8"') 
     }); 

     /* vp9 in webm codec */ 

     results.addItem({ 
      key: 'video.codecs.webm.vp9', 
      passed: !!element.canPlayType && canPlayType(element, 'video/webm; codecs="vp9"') 
     }); 

     /* does codec detection work properly? */ 

     var passed = true; 

     if (!!element.canPlayType) { 
      if (element.canPlayType('video/nonsense') == 'no') { 
       passed = false; 
       log('BUGGY: Codec detection bug in Firefox 3.5.0 - 3.5.1 and Safari 4.0.0 - 4.0.4 that answer "no" to unknown codecs instead of an empty string') 
      } 

      if (element.canPlayType('video/webm') == 'probably') { 
       passed = false; 
       log('BUGGY: Codec detection bug that Firefox 27 and earlier always says "probably" when asked about WebM, even when the codecs string is not present') 
      } 

      if (element.canPlayType('video/mp4; codecs="avc1.42E01E"') == 'maybe' && element.canPlayType('video/mp4') == 'probably') { 
       passed = false; 
       log('BUGGY: Codec detection bug in iOS 4.1 and earlier that switches "maybe" and "probably" around') 
      } 

      if (element.canPlayType('video/mp4; codecs="avc1.42E01E"') == 'maybe' && element.canPlayType('video/mp4') == 'maybe') { 
       passed = false; 
       log('BUGGY: Codec detection bug in Android where no better answer than "maybe" is given') 
      } 

      if (element.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"') == 'probably' && element.canPlayType('video/mp4; codecs="avc1.42E01E"') != 'probably') { 
       passed = false; 
       log('BUGGY: Codec detection bug in Internet Explorer 9 that requires both audio and video codec on test') 
      } 
     } 

     results.addItem({ 
      key: 'video.canplaytype', 
      passed: element.canPlayType ? (passed ? YES : YES | BUGGY) : NO 
     }); 
    },

参见Apple HTTP Live Streaming (HLS)

来源

2016-10-14 09:19:39 guest271314

如何在不同的浏览器和不同的操作系统上精确检测HLS支持？

回答

相关问题