web播放m3u8文件且进行加密处理
生活随笔
收集整理的這篇文章主要介紹了
web播放m3u8文件且进行加密处理
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
準備工作
前端代碼
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>演示：HTML5點播m3u8(hls)格式視頻</title> <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="css/demo.css"> <style> </style> </head> <body> <div class="container"><header><div class="row"><div class="col-md-3 col-xs-12"><h1 class="logo"><a href="http://www.helloweba.net" title="返回helloweba首頁">helloweba</a></h1></div><div class="col-md-9 text-right"</div></div></header><div class="row main"><div class="col-md-12"><div class="container" style="width: 96%; margin: 30px auto"><video id="video" controls loop="false" width="100%"></video></div></div></div><footer><p>Powered by helloweba.net 允許轉載、修改和使用本站的DEMO，但請注明出處：<a href="http://www.helloweba.net">www.helloweba.net</a></p></footer> </div> <script src="hls.js"></script><script> var video = document.getElementById('video');if(Hls.isSupported()) {var hls = new Hls();hls.loadSource('http://vfile1.grtn.cn/2019/1574/0031/1723/157400311723.ssm/157400311723.m3u8');hls.attachMedia(video);hls.on(Hls.Events.MANIFEST_PARSED,function() {video.play();});} </script> </body> </html>項目demo地址：https://github.com/xiadk/dk-hls?其中jiami是已經切分好的視頻
注意項目一定要通過服務器打開，本地打開沒用。
?
參考：
https://www.helloweba.net/javascript/571.html
https://www.cnblogs.com/codeAB/p/9184266.html
總結
以上是生活随笔為你收集整理的web播放m3u8文件且进行加密处理的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 站群服务器用SS5 SOCKS5 配置多
- 下一篇： ksearch系统开发过程中遇到的KFC