你是否遇到過這樣的困擾——看到一半的視頻,關閉后卻忘記進度,再打開時需要手動拖拽尋找上次的觀看位置?如今,“視頻自動續播功能”完美解決了這一痛點!無論是在線教育課程、影視劇集還是企業內部員工培訓,自動續播都能顯著提升觀看體驗和學習效率。今天這期帶大家了解一下視頻自動續播功能。
一、視頻自動續播功能是什么
視頻自動續播功能,是指播放器默認會記錄視頻上次觀看到的時間點,在同一瀏覽器中再次打開播放頁面,會自動從上一次觀看的時間點繼續播放,實現流暢、不間斷的觀看體驗。
視頻自動續播功能代碼調用示例
<!doctype html>
<html lang="cn" data-bs-theme="light">
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link href="assets/plugins/simplebar/css/simplebar.css" rel="stylesheet"><link href="assets/plugins/perfect-scrollbar/css/perfect-scrollbar.css" rel="stylesheet"><link href="assets/plugins/metismenu/css/metisMenu.min.css" rel="stylesheet"><link href="assets/css/pace.min.css" rel="stylesheet"><script src="assets/js/pace.min.js"></script><link href="assets/css/bootstrap.min.css" rel="stylesheet"><link href="assets/css/bootstrap-extended.css" rel="stylesheet"><link href="assets/sass/app.css" rel="stylesheet"><link href="assets/css/icons.css" rel="stylesheet"><link rel="stylesheet" href="assets/sass/bordered-theme.css"><title>視頻自動續播功能</title><meta name="Keywords" content="視頻自動續播功能,視頻續播,視頻播放續播" /><meta name="Description" content="視頻自動續播功能,是指播放器默認會記錄視頻上次觀看到的時間點,在同一瀏覽器中再次打開播放頁面,會自動從上一次觀看的時間點繼續播放。" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-okaidia.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/line-numbers/prism-line-numbers.min.css" rel="stylesheet" />
</head><body><!--wrapper--><div class="wrapper"><!--sidebar/b--><div class="sidebar-wrapper" data-simplebar="true"><div class="sidebar-header"><div><img src="assets/images/logo-icon.png" class="logo-icon" alt="logo icon"></div><div><h4 class="logo-text">H5Player</h4></div><div class="mobile-toggle-icon ms-auto"><i class='bx bx-x'></i></div></div><!--nav/b--><ul class="metismenu" id="menu"><li><a href="javascript:;" class="has-arrow"><div class="parent-icon"><i class="bx bx-category"></i></div><div class="menu-title">教育場景視頻應用</div></a><ul> <li class="none"> <a href="index.php"><i class='bx bx-radio-circle'></i>H5多終端調用范例</a></li><li class="none"> <a href="vrm.php"><i class='bx bx-radio-circle'></i>VRM分片錯序加密</a></li><li class="none"> <a href="userid.php"><i class='bx bx-radio-circle'></i>用戶ID跑馬燈 </a></li><li class="none"> <a href="random-watermark.php"><i class='bx bx-radio-circle'></i>數字化動態ID隨機水印</a></li><li class="none"> <a href="ai-invisible-watermark.php"><i class='bx bx-radio-circle'></i>AI隱形溯源水印</a></li><li class="none"> <a href="no-screen-recording.php"><i class='bx bx-radio-circle'></i>瀏覽器防錄屏</a></li><li class="none"> <a href="OVP.php"><i class='bx bx-radio-circle'></i>OVP視頻防盜鏈</a></li><li class="none"> <a href="ats-https.php"><i class='bx bx-radio-circle'></i>ATS/HTTPS數據防篡改</a></li><li class="none"> <a href="watermark.php"><i class='bx bx-radio-circle'></i>視頻水印/企業圖標</a></li><li class="none"> <a href="no-seeking.php"><i class='bx bx-radio-circle'></i>禁止拖動視頻進度條</a></li><li class="none"> <a href="multilingual-subtitles.php"><i class='bx bx-radio-circle'></i>智能字幕/自動生成字幕</a></li><li class="mm-active"> <a href="continue-playing.php"><i class='bx bx-radio-circle'></i>視頻自動續播</a></li><li class="none"> <a href="trial.php"><i class='bx bx-radio-circle'></i>片段試看/試聽購買</a></li><!--li> <a href="collector.php"><i class='bx bx-radio-circle'></i>視頻信息收集器</a></li--><li> <a href="qa-player.php"><i class='bx bx-radio-circle'></i>問答播放器/視頻彈題</a></li><li> <a href="speed.php"><i class='bx bx-radio-circle'></i>倍速播放/多倍速觀看</a></li><li> <a href="quality.php"><i class='bx bx-radio-circle'></i>多清晰度切換/畫質切換</a></li><li> <a href="knowledge-list.php"><i class='bx bx-radio-circle'></i>知識清單/知識點提示</a></li><li> <a href="data-analysis.php"><i class='bx bx-radio-circle'></i>數據分析/數據司南</a></li><li> <a href="cn-en-player.php"><i class='bx bx-radio-circle'></i>中英文播放器</a></li><li> <a href="ai-course.php"><i class='bx bx-radio-circle'></i>AI智能制課</a></li><li> <a href="ai-outline.php"><i class='bx bx-radio-circle'></i>視頻點播AI大綱</a></li><li> <a href="picture-in-picture.php"><i class='bx bx-radio-circle'></i>視頻畫中畫(PC端)</a></li></ul></li><li><a href="faq.php"><div class="parent-icon"><i class="bx bx-help-circle"></i></div><div class="menu-title">FAQ</div></a></li></ul> <!--nav/e--></div><!--sidebar/e --><!--header/b --><header><div class="topbar"><nav class="navbar navbar-expand gap-2 align-items-center"><div class="mobile-toggle-menu d-flex"><i class='bx bx-menu'></i></div><div class="top-menu ms-auto"><ul class="navbar-nav align-items-center gap-1"><li class="nav-item dark-mode d-none d-sm-flex"></li></ul></div><div class="user-box dropdown px-3"><a class="d-flex align-items-center nav-link " href="userlogin.php" role="button" ><img src="assets/images/mypic_no.jpg" class="user-img" alt="userpic"><div class="user-info"><p class="user-name mb-0">USER</p><p class="designattion mb-0">LOGIN</p></div></a><ul class="dropdown-menu dropdown-menu-end"><li><a class="dropdown-item d-flex align-items-center" href="userlogin.php"><i class="bx bx-user fs-5"></i><span>用戶登錄</span></a></li></ul></div></nav></div></header> <!--header/e --><!--mainpage/b --><div class="page-wrapper"><div class="page-content"><!--breadcrumb--><div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3"><div class="breadcrumb-title pe-3">Edu H5Player</div><div class="ps-3"><nav aria-label="breadcrumb"><ol class="breadcrumb mb-0 p-0"><li class="breadcrumb-item"><a href="javascript:;"><i class="bx bx-home-alt"></i></a></li><li class="breadcrumb-item active" aria-current="page">Demo</li></ol></nav></div></div><!--end breadcrumb--><div class="row"><div class="col-12 col-lg-9 mx-auto"><div class="text-center"><div id="player"></div></div><div class="text-center"><hr /><h5 class="mb-0">Edu Html5Player加密視頻播放器</h5><hr /></div></div><div class="col-12 col-lg-9 mx-auto"><div class="table-responsive-lg w-lg-75 mx-lg-auto table-wrapper" ><h5 class="mb-0 text-uppercase fw-bold lh-base mt-2"> 視頻續播/視頻自動續播</h5><div class="lh-base mt-2">視頻自動續播功能,是指播放器默認會記錄視頻上次觀看到的時間點,在同一瀏覽器中再次打開播放頁面,會自動從上一次觀看的時間點繼續播放,實現流暢、不間斷的觀看體驗,尤其適用于教學培訓課程的觀看場景。
</div></div></div> <div class="col-12 col-lg-9 mx-auto"><div class="table-responsive-lg w-lg-75 mx-lg-auto table-wrapper" ><hr /><h5 class="mb-0 text-uppercase fw-bold lh-base mt-2">代碼調用示例</h5><pre class="line-numbers"><code class="language-html"><div id="player"></div><script src="//player.polyv.net/resp/vod-player/latest/player.js"></script><script>var player = polyvPlayer({wrap: '#player',width: 800,height: 533,vid: '88083abbf5bcf1356e05d39666be527a_8',history_video_duration: 3, //默認時長超過5分鐘的視頻才會開啟續播功能,可通過此參數修改,單位:分鐘。ban_history_time: 'off' //當值為'on'時會禁用續播功能
});
</script></code></pre></div></div><div class="col-12 col-lg-9 mx-auto"><div class="table-responsive-lg w-lg-75 mx-lg-auto table-wrapper" ><hr /><h5 class="mb-0 text-uppercase fw-bold lh-base mt-2">視頻播放效果截圖</h5><p class="lh-base mt-2">以下為視頻自動續播的截圖:</p><div class="card"><div class="card-body"><img src="assets/images/continue-playing-1-02.png" alt="視頻續播/視頻自動續播" width="100%"></div></div><h6 class="mb-0 text-uppercase"><em>視頻自動續播(視頻從上一次中斷的時間點03:50,自動續播)</em></h6><hr /><div class="card"><div class="card-body"><img src="assets/images/continue-playing-1-03.png" alt="視頻續播/視頻自動續播" width="100%"></div></div><h6 class="mb-0 text-uppercase"><em>視頻自動續播(視頻從上一次中斷的時間點05:15,自動續播)</em></h6><hr /></div> </div></div><!--end row--></div></div><!--mainpage/e--><!--overlay/b--><div class="overlay toggle-icon"></div><!--overlay/e---><!--BackToTop/b--> <a href="javaScript:;" class="back-to-top"><iclass='bx bxs-up-arrow-alt'></i></a><!--BackToTop/e--><footer class="page-footer"><p class="mb-0">教育培訓場景視頻加密與視頻應用演示(DEMO)</p></footer> </div><!--wrapper/e--><!--js/b--><script src="assets/js/bootstrap.bundle.min.js"></script><script src="assets/js/jquery.min.js"></script><script src="assets/plugins/simplebar/js/simplebar.min.js"></script><script src="assets/plugins/metismenu/js/metisMenu.min.js"></script><script src="assets/plugins/perfect-scrollbar/js/perfect-scrollbar.js"></script><script src="assets/js/app.js"></script><!--script src="//player.polyv.net/resp/vod-player/latest/player.js"></script--><script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/line-numbers/prism-line-numbers.min.js"></script><script src='//player.polyv.net/resp/vod-player-drm/canary/player.js'></script><script>var pdiv = document.getElementById("player");var w = pdiv.offsetWidth; // 返回元素的總寬度var h = pdiv.offsetWidth*0.5625; // 返回元素的總高度var player = polyvPlayer({wrap: '#player',width: '100%',height: h, df: 3, autoplay: 'true',vid: 'ef03a1d2e50f96cc4a59b5a49bacf814_e',playsafe:'300c71f9-f0f3-43cd-bb22-f3b15bf48728-kUIDaTONYa2028', ts:'1753325327000',sign:'09e5c634fca0cfd406a586c0ef110658'});</script><!--js/e-->
</body>
</html>
二、視頻自動續播功能效果示例
進入視頻后,視頻自動從上次觀看的時間點繼續播放
三、視頻自動續播功能的應用場景
1、在線教育平臺
???- 學員中途退出課程后,下次登錄自動續播,提升學習連貫性。 ?
???- 結合賬號系統,實現電腦、手機等多端進度同步。 ?
2、長視頻與影視平臺
???- 用戶觀看電影、劇集時,自動從上次中斷處繼續,避免手動拖拽。 ?
3、企業培訓系統
???- 員工分段學習培訓視頻,續播功能確保進度不丟失,提高完成率。
我的更多原創文章
一篇看懂:“禁止拖動課程視頻進度條”功能有什么用?
每日功能介紹|在線課程提升互動效果的功能——視頻問答功能
企業如何讓內部視頻僅限公司官網或指定域名播放?
視頻加密技術和防翻錄技術有哪些?
付費課程視頻怎么做加密?教育視頻文件加密的9種玩法
教育培訓機構如何為課程視頻添加防盜錄的強水印?
在線教育培訓場景下,線上授課必備的六大功能
如何阻止課程視頻不被二次傳播?鎖定這三個視頻加密方法
如何確保線上課程不被盜錄?這4種方法很有效
教育培訓視頻如何讓學員學得更快?這4個方法很有效
在線教育培訓如何提高備課效率
?