在HTML5页面上播放M3U8的hls流地址
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>视频播放</title> <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script> </head> <body> <video id="video" style="border: 1px solid red;" width="640" height="480" controls autoplay></video> <script> if (Hls.isSupported()) { var videoElement = document.getElementById('video'); var hls = new Hls(); hls.loadSource('http://220.161.87.62:8800/hls/0/index.m3u8'); // M3U8地址，根据实际情况
修改
hls.attachMedia(videoElement); hls.on(Hls.Events.MANIFEST_PARSED, function() { videoElement.play(); }); } </script> </body> </html>
实现效果
