Hooks access
H5Player implements the hook function of the playback process based on webpack/tapable, providing the access party with the feasibility of intervention in the playback process.
Note: The hooks currently provided are all synchronous
1. Interface summary
| hooks name | callback definition | description |
|---|---|---|
| afterPlayerInit | SyncHook([player, renderConfig]) | Triggered after the player is initialized. Currently only effective for pass-through instances. |
| afterRendererInit | SyncHook([renderer, decoder]) | Rendering, decoder initialization completed |
| afterControl | SyncHook([object]) | Decoder operation result callback, pass-through takes effect |
| afterLoaded | SyncHook([player]) | Triggered after the player obtains the media stream address. At this time, it does not start playing the video or monitoring the intercom. It is effective for pass-through players, playback players, and monitoring intercom instances. |
| afterReady | SyncHook([player]) | The player is ready to start playing, supporting pass-through and playback. |
| afterBufferChange | SyncHook([object]) | Player cache amount changes, only used by plug-ins |
| onAcceptFrameData | SyncHook([decoder, param]) | Receive video frame alarm information, often used in SDK plug-in development |
| beforePlay | SyncHook([player, preventExecution]) | Triggered before the player plays the notification (play). Passthrough will automatically play when calling load, so only playback takes effect |
| beginPlay | SyncHook([]) | Start playing; currently pass-through is in effect |
| afterPlay | SyncHook([player]) | Triggered after the player gets the play notification (play), and the playback takes effect. |
| beforePause | SyncHook([player, preventExecution]) | Triggered before the player gets the pause notification (pause), playback takes effect. |
| afterPause | SyncHook([player]) | Triggered after the player gets the pause notification (pause), and playback takes effect. |
| afterSeek | SyncHook([timeData]) | After the player sets the time currentTime, it is triggered after the progress jump seek is completed. Only playback takes effect. |
| beforeStop | SyncHook([player, preventExecution]) | Callback before the video stops, playback takes effect. |
| afterStop | SyncHook([player, timeData]) | Triggered after the player stops. |
| beforeDestory | SyncHook([player, preventExecution]) | Callback before the video is destroyed. |
| afterDestory | SyncHook([player, timeData]) | Callback after destruction |
| onPlayEnded | SyncHook([player]) | Playback completed |
| onError | SyncHook([ErrorType, SubErrorType, ErrorDescription, ErrorInfo]) | Error callback, can monitor various errors generated during playback and passthrough |
| startReconnect | SyncHook([player]) | A hook that starts reconnecting after the direct connection is disconnected. |
| reconnectSuccess | SyncHook([player]) | Hook for successful reconnection after direct disconnection. |
| afterListenTalkAutoClose | SyncHook([player]) | Triggered after the device actively disconnects when listening to intercom. Only used to monitor intercom. |
| playerStatusToggle | SyncHook([playersStatus]) | Change the playback status of the playback channel. It needs to be distinguished from the player state. The playback state refers to whether the channel is in the playback state with streaming or in the idle state without streaming during the playback process. It can be used with the placeholder plug-in to implement custom masking when there is no video |
| startLoading | SyncHook([deviceInfo]) | Used to determine whether there is currently a channel to start buffering, usually used when the network is poor |
| stopLoading | SyncHook([deviceInfo]) | Used to determine whether the current channel has ended buffering and can start playback. Usually used when the network is poor. |
| onLoading | SyncHook([loadingList, done]) | Used to call back the percentage information and network speed information during loading, common for passthrough and playback. |
| loadingTimeout | SyncHook([deviceInfo]) | Used to determine buffer timeout (20s). In 1.3.9, the timeout duration remains the same as the seek timeout duration. |
| onTimeChange | SyncHook([timeData]) | Actively push the time during playback. The push frequency can be configured in config, and the default is 500ms. If the business layer requires smooth movement of the timeline, the frequency can be set lower, especially for small files played back by the server. |
| onChannelRender | SyncHook([frame, chanPlayer]) | Gives the device information or AI information of the current player rendering frame |
2. API interface
2.1. afterPlayerInit
describe
Triggered after the player is initialized. Currently only effective for pass-through instances.
Example
- player.hooks.afterPlayerInit.tap('after init', callback(player, config));
Note: player is the playback instance
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
| config | rendering parameters |
2.2. afterRendererInit
describe
Rendering, decoder initialization completed
Example
- player.hooks.afterRendererInit.tap('renderer init', callback(renderer, decoder));
Callback Parameters
| Parameters | Description |
|---|---|
| renderer | renderer |
| decoder | decoder |
2.3. afterControl
describe
Decoder operation result callback, pass-through takes effect
Example
- player.hooks.afterControl.tap('afterControl', callback({type, status, utc}));
Callback Parameters
| Parameters | Description |
|---|---|
| type | Player operation type |
| status | Operation status, 0: failure; 1: success |
| utc | video timestamp |
2.4. afterLoaded
describe
It is triggered after the player obtains the media stream address. At this time, it does not start playing the video or monitoring the intercom. It is effective for pass-through players, playback players, and monitoring intercom instances.
Example
- player.hooks.afterLoaded.tap('afterLoaded', callback(player));
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
2.5. afterReady
describe
The player is ready to start playing and supports pass-through and playback.
Example
- player.hooks.afterReady.tap('afterReady', callback(player));
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
2.6. afterBufferChange
describe
The amount of player cache has changed and is only used by plug-ins.
Example
- player.hooks.afterBufferChange.tap('afterBufferChange', callback({ startTime, endTime, frameCount, session }));
Callback Parameters
| Parameters | Description |
|---|---|
| startTime | Buffering start time |
| endTime | buffer end time |
| frameCount | Number of buffered video frames |
| session | session |
2.7. onAcceptFrameData
describe
Receive video frame alarm information, often used in SDK plug-in development
Example
- player.hooks.onAcceptFrameData.tap('onAcceptFrameData', callback(decoder, param));
Callback Parameters
| Parameters | Description |
|---|---|
| decoder | decoder |
| param | Video alarm parameters |
2.8. beforePlay
describe
Triggered before the player plays the notification (play). Passthrough will automatically play when load is called, so only playback takes effect.
Example
- player.hooks.beforePlay.tap('beforePlay', callback(player, preventExecution));
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
| preventExecution | function, blocking function, can be used to prevent subsequent execution of play |
2.9. beginPlay
describe
Start playing; currently pass-through is in effect
Example
- player.hooks.beginPlay.tap('beginPlay', callback());
2.10. afterPlay
describe
Triggered after the player gets the play notification (play), playback takes effect.
Example
- player.hooks.afterPlay.tap('afterPlay', callback(player));
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
2.11. beforePause
describe
Triggered before the player gets the pause notification (pause), playback takes effect.
Example
- player.hooks.beforePause.tap('beforePause', callback(player, preventExecution));
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
| preventExecution | function, blocking function, can be used to prevent subsequent execution of pause |
2.12. afterPause
describe
Triggered after the player gets the pause notification (pause), playback takes effect.
Example
- player.hooks.afterPause.tap('afterPause', callback(player));
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
2.13. afterSeek
describe
After the player sets the time currentTime, it is triggered after the progress jump seek is completed, and only playback takes effect.
Example
- player.hooks.afterSeek.tap('after seek', callback(timeData));
Callback Parameters
| Parameters | Type | Description |
|---|---|---|
| timeData | Object | Time data, refer to afterStop. |
Note: The onError callback is used in the scenario where seek fails.
2.14. beforeStop
describe
Called back before the video stops and playback takes effect.
Example
- player.hooks.beforeStop.tap('beforeStop', callback(player, preventExecution));
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
| preventExecution | function, blocking function, can be used to prevent subsequent execution of stop |
2.15. afterStop
describe
Fired after the player has stopped.
Example
- player.hooks.afterStop.tap('after stop', callback[player, timeData]);
Callback Parameters
The timeData type is Object. This parameter is only available for monitoring intercoms. The structure is as follows:
| Parameters | Description |
|---|---|
| startTime | Start time, client UTC timestamp, unit: milliseconds. If not started, the value is null. |
| endTime | End time, client UTC timestamp, unit: milliseconds. |
| duration | Playback duration, unit: milliseconds. If not started, the value is null. |
2.16. beforeDestory
describe
Callback before the video is destroyed.
Example
- player.hooks.beforeDestory.tap('beforeDestory', callback(player, preventExecution));
Callback Parameters
| Parameters | Description |
|---|---|
| player | player instance |
| preventExecution | function, blocking function, can be used to prevent subsequent execution of destroy |
2.17. afterDestory
describe
Callback after destruction
Example
- player.hooks.afterDestory.tap('afterDestory', callback(player, timeData));
Callback Parameters
The timeData type is Object. This parameter is only available for passthrough. Please refer to afterStop.
| Parameters | Description |
|---|---|
| player | player instance |
| timeData | Reference afterStop |
2.18. onPlayEnded
describe
Playback completed
Example
- player.hooks.onPlayEnded.tap('onPlayEnded', callback(player));
2.19.onError
describe
Error callback, can monitor playback and various errors generated during pass-through
Example
player.hooks.onError.tap('An error occurred', callback(errorType, subErrorType, errorDesription, errorInfo));
Callback Parameters
| Parameter name | Type | Description |
|---|---|---|
| errorType | String | Error type |
| subErrorType | String | Error subtype |
| errorDescription | String | Error description |
| errorInfo | Object | Rest of information |
For details, refer to error-code.md
2.20. startReconnect
describe
After the direct connection is disconnected, the hook starts reconnection.
Example
- player.hooks.startReconnect.tap('start reconnecting', callback(player));
2.21. reconnectSuccess
describe
After the direct connection is disconnected, the hook is successfully reconnected.
Example
- player.hooks.reconnectSuccess.tap('start reconnecting', callback(player));
2.22. afterListenTalkAutoClose
describe
When monitoring intercom, it is triggered after the device actively disconnects. Only used to monitor intercom.
Example
- intercomPlayer.hooks.afterListenTalkAutoClose.tap('auto close', callback(player));
Callback Parameters
| Parameters | Description |
|---|---|
| player | Monitoring or intercom instance |
2.23. playerStatusToggle
describe
The playback status of the playback channel changes. It needs to be distinguished from the player state. The playback state refers to whether the channel is in the playback state with streaming or in the idle state without streaming during the playback process. It can be used with the placeholder plug-in to implement custom masking when there is no video.
Example
- player.hooks.playerStatusToggle.tap('placeholder', callback(playersStatus));
Callback Parameters
| Parameters | Data type | Description | |
|---|---|---|---|
| playersStatus | Object[] | A collection of channel playback status changes | |
| playerStatus:Object | devId | String | Device Id |
| channel | Number | channel number | |
| status | String | Changed playback status | |
| next | Function | Callback function that requires placeholder |
2.24. startLoading
describe
Used to determine whether there is currently a channel starting to buffer, usually used when the network is poor.
Example
- player.hooks.startLoading.tap('start loading', callback(devideInfos));
Callback Parameters
| Parameters | Data type | Description | |
|---|---|---|---|
| deviceInfo | Object[] | Device channel list | |
| deviceInfo:Object | devId | String | Device Id |
| channel | Number | channel number |
2.25. stopLoading
describe
Used to determine whether there is currently a channel that has ended buffering and can start playback. Usually used when the network is poor.
Example
- player.hooks.stopLoading.tap('start loading', callback(devideInfos));
Callback Parameters
| Parameters | Data type | Description | |
|---|---|---|---|
| deviceInfo | Object[] | Device channel list | |
| deviceInfo:Object | devId | String | Device Id |
| channel | Number | channel number |
2.26.onLoading
describe
Used to call back the percentage information and network speed information during loading, common to passthrough and playback.
Example
- player.hooks.loadingTimeout.tap('on loading', callback(loadingList, done));
Callback Parameters
| Parameters | Data type | Description | |
|---|---|---|---|
| loadingList | Object[] | Device channel information list in loading | |
| devId | string | device number | |
| channel | number | channel number | |
| percent | number | Progress percentage, 0-100 | |
| network | number | Network speed information, unit KB/s | |
| done | boolean | Whether the loading is completed or not loading |
2.27. loadingTimeout
describe
Used to determine buffer timeout (20s). In 1.3.9, the timeout duration remains the same as the seek timeout duration.
Example
- player.hooks.loadingTimeout.tap('loading timeout', callback(devideInfos));
Callback Parameters
| Parameters | Data type | Description | |
|---|---|---|---|
| deviceInfo | Object[] | Device channel list | |
| deviceInfo:Object | devId | String | Device Id |
| channel | Number | channel number |
2.28. onTimeChange
describe
Actively push the time during playback. The push frequency can be configured in config, and the default is 500ms.
If the business layer requires smooth movement of the timeline, the frequency can be set lower, especially for small files played back by the server.
Example
- player.hooks.onTimeChange.tap('time change', callback(timeData));
Callback Parameters
| Parameters | Data type | Description | |
|---|---|---|---|
| timeData | Object | ||
| dateTime | String | A time string formatted according to the time zone of the incoming configuration, such as "2022-12-28 16:17:34". This format can be configured in the global configuration config, the default is "YYYY-MM-DD HH:mm:ss" | |
| utc | Number | utc time, unit second, int. | |
| ms | Number | The number of milliseconds after utc second, value 0-999. |
2.29. onChannelRender
describe
Gives the device information or AI information of the current player rendering frame
Example
- player.hooks.onChannelRender.tap('onChannelRender', callback(frame, chanPlayer))
Callback Parameters
| Parameters | Data type | Description |
|---|---|---|
| frame | object | Frame data carrying AI or device information |
| chanPlayers | object | The channel player currently rendering this data frame |