video调用直播接口:防止缓存方案

有时候我们需要调用解析过直播接口,使用video播放,但是在暂停又开始后,直播视频不会自动刷新,而是继续从暂停之前的时间点开始播放。

下面是我的解决方案代码,弟弟们请看我的下面:

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8">
 5     <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
 6     <title></title>
 7     <script src="js/mui.min.js"></script>
 8     <link href="css/mui.min.css" rel="stylesheet"/>
 9     <script type="text/javascript" charset="utf-8">
10           mui.init();
11     </script>
12 </head>
13 <body>
14     <div class="mui-content" style="background-color: #000000;">
15         <video ontimeupdate="myFunction()" width="100%" height="auto" id="videoPlay1" poster="/hyData/weixinPages/images/video-img.png" 
16          controls=controls 
17          x5-playsinline=""
18         webkit-playsinline="true"
19          playsinline="true"> 
20             <source src="http://tx.hls.huya.com/huyalive/93779849-93779849-402781384478818304-142748044-10057-A-0-1.m3u8?wsSecret=c35b2cf6ea8d4e423f1f4337bad6f3b6&wsTime=4ce2430d">
21         </video>
22     </div>
23 </body>
24 <script>
25     flag = false;
26     var vid = document.getElementById("videoPlay1");
27     console.log(vid);
28     function myFunction() {
29         //获取当前的播放时间
30         //console.log(vid.currentTime);
31         //false 点击了播放  true 点击了暂停  
32         //console.log(vid.paused); 
33         if(vid.paused){
34             console.log("已经暂停了");
35                 /*下面有一段特别复杂的函数*/
36                 var t2 = window.setInterval(function() {
37                 if(!vid.paused){
38                     vid.load();
39                     vid.play();
40                     window.clearInterval(t2);  // 去除定时器
41                     console.log("开始重新播放视频");
42                 }
43                 console.log("正在执行定时任务");
44                 },100);
45         }
46     };
47 </script>
48 </html>

猜你喜欢

转载自www.cnblogs.com/sixgodbiao/p/11980065.html