html5的video标签实现m3u8格式的支持，基于hls.min.js

切图网站的踩坑笔记，vue开发项目中通过api接口获取到了m3u8格式的音频，但是有的浏览器默认不支持，所以需要借助辅助手段来实现，下面介绍详细方法。

什么是m3u8？

m3u8是m3u的一种，是utf-8格式的，Apple 为了提高流播效率开发的技术，特点是将流媒体切分为若干 TS 片段（比如每10秒一段），然后通过一个扩展的 m3u 列表文件将这些 TS 片段集中起来供客户端播放器接收。可以做多码率的适配，根据网络带宽，客户端会自动选择一个适合自己码率的文件进行播放，保证视频流的流畅。

html5的video标签实现对HLS(m3u8格式)的支持方法

<script src="https://cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script>
<video id="video"></video>
<script>
if(Hls.isSupported()) {
var video = document.getElementById('video');
var hls = new Hls();
hls.loadSource('http://www.streambox.fr/playlists/test_001/stream.m3u8');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function() {
video.play();
});
}
</script>

来源：http://www.qietu.com/hml5-video-m3u8-hls-min-js/