如何获取videojs播放器的上一状态（播放、暂停等）

Video.js 原生没有内置类似jwplayer oldstate 的历史状态属性，通过事件监听缓存状态即可实现完全等效的能力，无需额外安装插件。

实现步骤 #

1. 初始化状态存储变量 #

在播放器初始化完成后，定义两个变量分别存储当前状态、上一状态，初始值取播放器的实时状态：

// 初始化播放器实例
const player = videojs('your-video-element-id');

// 状态存储变量
let currentState = player.paused() ? 'paused' : 'playing';
let previousState = null; // 该变量即等效jwplayer的oldstate，可全局读取

2. 绑定状态事件更新历史值 #

Video.js 所有状态变更都会触发对应事件，每次状态切换时先将旧的当前状态存入previousState，再更新当前状态即可。
常用播放类状态对应的触发事件如下：

• play：播放器进入播放中状态
• pause：播放器进入已暂停状态
• ended：播放器进入播放结束状态
• waiting：播放器进入缓冲等待状态

绑定事件的示例代码：

// 统一状态更新方法
function handleStateChange(newState) {
  previousState = currentState;
  currentState = newState;
}

// 为各状态事件绑定更新逻辑
player.on('play', () => {
  handleStateChange('playing');
});

player.on('pause', () => {
  handleStateChange('paused');
});

player.on('ended', () => {
  handleStateChange('ended');
});

player.on('waiting', () => {
  handleStateChange('waiting');
});

3. 读取上一状态 #

业务逻辑中需要获取上一状态时，直接读取previousState变量即可，和jwplayer读取oldstate的用法完全一致：

// 示例：暂停时判断上一状态做不同逻辑处理
player.on('pause', () => {
  if (previousState === 'playing') {
    // 从播放中触发的暂停，一般是用户手动点击暂停
    console.log('触发用户暂停埋点');
  }
  if (previousState === 'waiting') {
    // 从缓冲状态触发的暂停，一般是网络异常导致
    console.log('触发缓冲中断埋点');
  }
});

如果需要监听更多状态（比如全屏切换、倍速变更、广告播放等），只需参考Video.js官方事件列表绑定对应事件，在事件回调中调用handleStateChange传入新状态值即可扩展支持。

内容的提问来源于stack exchange，提问作者rumteen farivar