PHP无法直接控制前端播放器进度,需前后端协作:前端定时上报进度并存储,加载时根据PHP返回的position设置audio.currentTime,注意播放器事件时机、并发写入防护及网络状态容错。

PHP 无法直接控制前端播放器进度
PHP 是服务端语言,不接触 DOM 和音频播放状态,所谓“同步播放进度”实际是前后端协作问题:前端定时上报进度,PHP 负责存储;用户下次进入时,PHP 返回上次保存的 position,前端用它调用播放器的 currentTime 属性跳转。
前端需主动上报播放进度到 PHP 接口
不能依赖页面卸载(beforeunload)——容易丢失;推荐使用节流 + 定时上报(如每 10 秒一次),并监听 ended 事件补报最终值。
- 使用
setInterval获取audio.currentTime,避免频繁请求 - 上报时携带唯一标识:
book_id、user_id(或session_id)、position - 接口建议用 POST,路径如
/api/save-progress.php - 务必校验
book_id和用户权限,防止恶意覆盖他人进度
PHP 接口保存进度要防并发写入和精度丢失
多个标签页/设备同时播放同一本书时,可能并发写入。直接用文件存易丢数据;用数据库更稳妥,但要注意字段类型。
- MySQL 中存储进度推荐用
DECIMAL(10,2)(单位:秒),不用FLOAT避免浮点误差 - 关键 SQL 应带
ON DUPLICATE KEY UPDATE或用事务+行锁(如SELECT ... FOR UPDATE) - 如果用 Redis,可用
HSET progress:{user_id} {book_id} {position},过期时间设为 30 天 - 别忘了返回成功响应(HTTP 200 + JSON
{"ok":true}),前端才好判断是否上报成功
加载时 PHP 返回进度,前端必须手动设置 currentTime
拿到 PHP 返回的 position 后,不能直接赋值给 audio.currentTime —— 此时音频可能还没加载完成,会静默失败。
立即学习“PHP免费学习笔记(深入)”;
- 必须等
loadedmetadata或canplay事件触发后再设置 - 示例逻辑:
audio.addEventListener('loadedmetadata', () => { if (savedPosition > 0 && audio.duration > savedPosition) { audio.currentTime = savedPosition; } }); - 若音频是流式(如 HLS),需确认播放器是否支持毫秒级跳转;某些插件(如
hls.js)要用hls.startLoad(position)替代原生currentTime











