HOOKS 接入#

H5Player 基于 webpack/tapable 实现了播放过程的钩子函数，为接入方提供了在播放过程的介入可行性

1. 接口汇总#

2. API 接口#

2.1. afterPlayerInit#

描述

播放器初始化后触发，目前只对直通实例生效

示例

• player.hooks.afterPlayerInit.tap('after init', callback(player, config));

注：player 即播放实例

回调参数

2.2. afterLoaded#

描述

播放器获取到媒体流地址后触发，此时并没有开始播放视频或者监听对讲。对直通播放器，回放播放器，监听对讲实例均生效。

示例

• player.hooks.afterLoaded.tap('afterLoaded', callback(player, eventData));

回调参数

2.3. afterReady#

描述

播放器已准备好开始播放，支持直通、回放。

示例

• player.hooks.afterReady.tap('afterReady', callback(player, eventData));

回调参数

2.4. beforePlay#

描述

播放器播放通知 (play) 前触发。直通在调用 load 会自动播放，因此只有回放生效。

示例

• player.hooks.beforePlay.tap('beforePlay', callback(player, eventData));

回调参数

2.5. afterPlay#

描述

播放器获取到播放通知 (play) 后触发，回放生效。

示例

• player.hooks.afterPlay.tap('afterPlay', callback(player, eventData));

回调参数

2.6. beforePause#

描述

播放器获取到暂停通知 (pause) 前触发，回放生效。

示例

• player.hooks.beforePause.tap('beforePause', callback(player, eventData));

回调参数

2.7. afterPause#

描述

播放器获取到暂停通知 (pause) 后触发，回放生效。

示例

• player.hooks.afterPause.tap('afterPause', callback(player, eventData));

回调参数

2.8. beforeStop#

描述

视频停止前回调，回放生效。

示例

• player.hooks.beforeStop.tap('beforeStop', callback(player, eventData));

回调参数

2.9. afterStop#

描述

播放器停止后触发。

示例

• player.hooks.afterStop.tap('after stop', callback[player, timeData]);

回调参数

timeData 类型为 Object，监听对讲才有此参数，结构如下：

2.10. beforeSeek#

描述

用户调用触发 seek，状态为 seeking 状态，仅回放生效。

示例

• player.hooks.afterSeek.tap('after seek', callback(player, eventData));

回调参数

2.11. afterSeek#

描述

完成进度跳转 seek 后触发，仅回放生效。

示例

• player.hooks.afterSeek.tap('after seek', callback(timeData));

回调参数

注：seek 失败场景下走 onError 回调

2.12. beforeDestroy#

描述

视频销毁前回调。

示例

• player.hooks.beforeDestroy.tap('beforeDestory', callback(player, preventExecution));

回调参数

2.13. onPlayEnded#

描述

回放播放完成

示例

• player.hooks.onPlayEnded.tap('onPlayEnded', callback(player));

2.14. onError#

描述

错误回调，能监听回放，直通中产生的各种错误

示例

player.hooks.onError.tap('An error occurred', callback(errorInfo, player?));

回调参数

详情参考 error-code.md

2.15. startReconnect#

描述

直通断线后，开始重连的 hook.

示例

• player.hooks.startReconnect.tap('start reconnecting', callback(player));

2.16. reconnectSuccess#

描述

直通断线后，重连成功的 hook.

示例

• player.hooks.reconnectSuccess.tap('reconnectSuccess', callback(player));

2.17. onVideoPlaceholder#

描述

回放通道播放状态变更。与播放器状态需要区分，播放状态是指在播放过程中，通道是有流的播放状态或无流的空闲状态；可配合 placeholder 插件实现自定义无视频时遮罩

示例

• player.hooks.onVideoPlaceholder .tap('placeholder', callback(playersStatus));

回调参数

2.18. onLoading#

描述

用于回调 loading 时的百分比信息和网速信息，直通和回放通用。

注：直通模式下，不能通过 done 参数判断是否 loading 结束，需要判断 通道的 percent 是否等于 100，来取消单个通道的 loading

示例

• player.hooks.onLoading.tap('on loading', callback(loadingList, done));

回调参数

2.19. loadingTimeout#

描述

用于判断缓冲超时 ，超时时间按通用配置为准，默认 20s。

示例

• player.hooks.loadingTimeout.tap('loading timeout', callback(devideInfos));

回调参数

2.20. onTimeChange#

描述

回放播放过程中主动推送时间。推送频率可在 config 中配置，默认 500ms。

如果业务层需要时间轴平滑移动，可将频率 设置低些，特别是服务器回放的小文件。

示例

• player.hooks.onTimeChange.tap('time change', callback(timeData));

回调参数

2.21. onChannelRender#

描述

给出当前播放器渲染帧的设备信息或 AI 信息

示例

• player.hooks.onChannelRender.tap('onChannelRender', callback(frame, chanPlayer))

回调参数

2.22. onMediaInfo#

描述

媒体信息回传

示例

• player.hooks.onMediaInfo.tap('onMediaInfo', callback(player, eventData))

回调参数

2.23. onMessage#

描述

提示信息回调

示例

• player.hooks.onMessage.tap('onMessage', callback(code, message))

回调参数

2.24. onFramePlayNoData#

描述

逐帧无数据回调

示例

• player.hooks.onFramePlayNoData.tap('frame play no data', callback(player, type, options))

回调参数

options

2.25. onStateChange#

描述

播放器状态改变回调

示例

• player.hooks.onStateChange.tap('state change', callback(player, stateInfo, state))

回调参数

stateInfo

type TStateInfo = {
    [key: string]: {
        state: string, // 参考播放器状态
        info: {
            oneDev: {
                devId: string, // 设备号
                channel: string, // 通道号
            },
            devId: string, // 设备号
            channel: string, // 通道号
        }
    }
}

2.26. onStreamTypeChange#

描述

播放器码流切换回调

示例

• player.hooks.onStreamTypeChange.tap('stream change', callback(player, eventData))

回调参数

TEventData

type TEventData = {
    devId: string, // 设备id
    channel: number, // 通道
    streamType: 'MAJOR' | 'MINOR', // 码流类型
}

2.27. onInputAudioDevicesChange#

描述

播放器码流切换回调

示例

• player.hooks.onInputAudioDevicesChange.tap('device change', callback(eventData, player))

回调参数

TEventData

type TEventData = {
    audioDevicesInput: MediaDeviceInfo[], // 输入设备信息
    audioDevicesOutput: MediaDeviceInfo[], // 输出设备信息
    deviceInputIdUse: string | undefined, // 输入设备id
}