可在视频播放页用sessionstorage实时保存当前播放时间，页面刷新或重开（同标签页）后读取并跳转；它仅在当前标签页生命周期有效，关闭即清空；需监听timeupdate事件防抖保存、loadedmetadata后恢复位置，并结合visibilitychange和beforeunload事件确保进度不丢失。
可以在视频播放页用 sessionStorage 实时保存当前播放时间，页面刷新或重新打开（同标签页内）后读取并跳转到该位置。注意它只在当前标签页生命周期内有效，关闭标签页即清空。
监听页面播放进度并存入 sessionStorage
监听视频的 timeupdate 事件，在播放过程中定期（如每5秒）保存当前 currentTime：
- 使用
setTimeout或setInterval控制保存频率，避免频繁写入 - 推荐用防抖方式：只有播放暂停或用户离开前才保存最后一次位置，减少冗余操作
- 示例代码：
let saveTimer;<br>video.addEventListener('timeupdate', () => {<br> clearTimeout(saveTimer);<br> saveTimer = setTimeout(() => {<br> sessionStorage.setItem('videoPosition', video.currentTime.toFixed(2));<br> }, 5000);<br>});
页面加载时恢复播放位置
在页面初始化阶段（如 DOMContentLoaded 或视频元素就绪后），读取并设置播放时间：
- 先检查
sessionStorage.getItem('videoPosition')是否存在且为有效数字 - 确保视频已加载元数据（
loadedmetadata事件后）再调用video.currentTime = ...，否则可能报错 - 可配合显示提示：“继续从 X:XX 处播放？”增强体验
处理标签页切换与页面卸载场景
sessionStorage 自动随标签页关闭而清除，但需主动应对用户切走、刷新、意外关闭等情况：
- 监听
visibilitychange：当页面隐藏时立即保存一次位置，防止切到其他标签页后丢失进度 - 监听
beforeunload：作为兜底，确保刷新或关闭前最后一次保存（注意部分浏览器限制该事件中的异步操作） - 避免在
pagehide中依赖 Promise，优先用同步sessionStorage.setItem
与其他存储方案的区别提醒
明确 sessionStorage 的适用边界：
- 不跨标签页：新打开的同 URL 标签页不会共享位置，适合单页连续观看场景
- 不持久化：关掉整个标签页就清空，如需长期记忆（比如多天后继续看），应改用
localStorage并加用户标识 - 同源限制：仅限当前协议+域名+端口，iframe 跨域时不可访问
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
