javascript - 获取多个视频的当前播放时间

Question

我需要从数据库中获取多个视频的当前播放时间。

我想把播放视频的时间保存在数据库中，这样我可以在用户进来的时候为他设置正确的位置。

我正在使用 setInterval 每 4 秒触发一次 ajax。有什么帮助吗？

代码

<?php

$tl="channel";
$ooa="playing";
$played="played";

$timeline = mysqli_query($con, "SELECT * FROM plays WHERE streamers_type ='$tl' AND played !='$played' GROUP BY streamers_id ORDER BY id ASC") or die ();

while($row = mysqli_fetch_array($timeline)) {
    $id = $row['id'];
    $file1 = $row['file1'];
    $video_name = $row['video_name'];
    $video_type = $row['video_type'];
    $about_video = $row['about_video'];
    $streamers_type = $row['streamers_type'];
    $streamers_id = $row['streamers_id'];
    $time_start = $row['time_start'];
    $time_stop = $row['time_stop'];
    $date = $row['date'];
    $streamers_name = $row['streamers_name'];
    $views = $row['views'];
    $played = $row['played'];

            ?>  
    <li class="col-lg-4 col-sm-5 col-xs-12 spinal">
    <b style="border:1px solid; color:red; margin-left:3px!important;"><?php echo $streamers_name ?></b>
    <span class="pull-right"><span id = "fhkj"><?php echo $views?></span>&nbsp; &nbsp;<i class="fa fa-eye"></i></span>
        <a class="fg" title="<?php echo $video_name ?>">
        <button data-toggle="modal" data-target="#modal-1" data-backdrop="static" data-keyboard="false"  class="fire" id="<?php echo $id ?>">

        <video class="uopi " id="<?php echo $video_name ?>" style="height:180px; width:100%!important;" autoplay muted onended="run();"><source src="plays/<?php echo $file1 ?>" type="<?php echo $video_type ?>"></video>

        <h2 style="background-color:#fff;color:orange; line-height:30px; font-size:1.3em;"><?php echo $video_name ?></h2>
            <span class="glyphicon glyphicon-play-circle"></span></button>

        </a>
    </li>
          }
     ?>




           <script type='text/javascript'> //function to update time    
         var vid = $('.uopi').attr('id');
   var ok = vid.currentTime;
      $(document).ready(function() {
     setInterval(function () {
          $.ajax({
          type : 'POST',
           url : 'updatetime.php', 
          data :  {ok: ok}, .
          success : function(r)
           {
          alert('Yay'); //would be commented out later dont really need any success just save

           }
    });

     }, 4000);
})   
</script>

Answer 1

首先，修复 SQL 查询中的 SQL 注入(inject)漏洞 (How can I prevent SQL injection in PHP?):P

我对您的问题的答复是您可以使用“beforeunload”事件。如果用户单击链接或关闭实际的选项卡/窗口，代码将被执行。您可以使用这样的代码:

window.addEventListener("beforeunload", function(e){
   var vid = $('.uopi').attr('id');
   var ok = vid.currentTime;
   $.ajax({
        type : 'POST',
        url : 'updatetime.php', 
        data :  {ok: ok},
        success : function(r)
        {
            console.log('Yay'); 
        }
    });
}, false);

编辑:您还可以使用“暂停”等视频事件来更新当前时间。