简体中文

1.X 升级 2.0.1 指南

1. 优化及功能

1.1. 优化项

mse 模式下：内存优化 40%-50%，32 路 cif 情况下内存仅占用 300-400Mb
新增 webcodecs 解码器，马赛克安全等级提升，在数据层进行打码
wasm/webcodecs 模式下：直通低延迟，内网情况下小于 500ms
AI 展示性能优化，包括 ADAS、DMS、马赛克展示等
包体积优化，从 8.9M 优化到 4.5M，gzip 后 1.4M

1.2. 直通复用

通道复用：修改原来每个通道一个实例方式，采用设备维度方式，按一个设备一个实例创建，内部消化通道概念

// 1.x 直通按照通道方式创建
const livePlayer = playerjs.createLivePlayer(divDom, {
    devId: '设备ID',
    channel: '1'
});
// 2.x 创建直通播放
const livePlayer = playerjs.createLivePlayer(domList, {
     deviceInfos: [{
         devId: '设备ID',
         channels: '1'
     }],
     ...
});

设备复用：支持多个设备同一个实例进行播放，以下为设备追加示例

// 2.x 可以添加相同或者不同设备，如果是不同设备，会自动创建新的player实例（播放器内部实现）。
type channelInfo = {
    channel: number;
    devId: string;
    dom: HTMLElement;
};
livePlayer.addStream(addList: channelInfo[]);

1.3. 基于 S17-FMS 云存储回放播放

为了减少数据的路由中转，我们新增直连云存储播放能力，通过 FMS 查询文件详情获取文件下载地址进行播放，该方案支持播放 MP4、锐明格式数据。
在原服务器回放、证据回放、虚拟回放基础上新增如下两个参数

netRequestType: 2,   //网络请求类型      1 - S17，2 - 云存储, 3 - 网络流 , 4 - 设备直连
fileType: 1,        //云存储播放文件类型，1 - rm264/265，2 - mp4

1.4. 基于网络流 url 播放

为了满足业务线更好使用播放能力，现对直接设置 url 方式进行播放，目前支持 MP4、FLV
视频编码格式仅支持 264、265，音频编码格式仅支持 AAC
支持暂停、恢复、倍数、逐帧、拖动（FLV 协议不支持，推动到缓存是允许的）。
支持多路播放，如未设置各个通道 url 绝对时间，则无法保证画面级同步，仅支持按相对时间同步播放
通过 onMediaInfo hooks 回调网络流实际时长，如 flv 中未携带，默认为 24 小时。

{
    beginTime: '2022-02-18 00:00:00', // 非必填，如未填写情况下，默认从0开始
    netRequestType: 3,                // 网络请求类型      1 - S17，2 - 云存储, 3 - 网络流 , 4 - 设备直连
    platformTimeZoneOffset: 480,      // 用户时区
    fileType: 2,                      // 播放文件类型，2 - mp4 3 - flv
    fileList: [                       // 指定播放通道播放时间段，仅Mp4格式支持携带时间进行同步，flv仅支持通道单文件
        {
            chan: 1,
            beginTime: '2022-02-18 00:04:00',  // 非必填，如未填写时间情况下，当前通道仅支持播放一个文件
            endTime: '2022-02-18 00:16:00',    // 非必填，如未填写时间情况下，当前通道仅支持播放一个文件
            netUrl : 'http://xxxxxx.mp4'
        },
        {
            chan: 2,
            beginTime: '2022-02-18 00:00:00',  // 非必填，如未填写时间情况下，当前通道仅支持播放一个文件
            endTime: '2022-02-18 00:12:00',    // 非必填，如未填写时间情况下，当前通道仅支持播放一个文件
            netUrl : 'http://xxxxxx.mp4'
        }
    ]
}

1.5. N9M 设备直连播放

为了实现基础能力复用，N9M 设备前端需要支持多路硬解播放，目前支持直通、设备回放
支持暂停、恢复、倍数、逐帧、拖动、主子码流切换
参数与普通设备回放一致，额外新增参数如下：

netRequestType: 4,   //网络请求类型      1 - S17，2 - 云存储, 3 - 网络流 , 4 - 设备直连

1.6. 基于 S17 播放回放支持多种 Seek 方式

为了解决 GB28181、标准 JT1078 回放播放拖动问题，需要支持关闭播放，按 seek 后时间重新下发播放
支持自定义等待间隔，默认 500ms

playerjs.config.seekRecWaitTime = 500; // seek 重连方式等待时间，默认500ms，单位ms

seek 接口支持类型传入

historyPlayer.seek(time, autoPlay， type) // type 0 - 接口方式， 1 - 重连方式（仅对S17 设备回放、融合回放生效）

1.7.基于 S17 播放回放支持 H5 私有协议播放

H5 私有协议：一条链路传输多通道数据，前端进行渲染播放，优化在弱网情况下的体验性。
SDK 侧根据与 S17 能力协商进行约定，当用户不设置 mediaProtocol 时，我们优先使用私有协议，如果用户设置，则使用用户配置。

2. 接口变更

2.1. 全局配置

删除 ip、port、httpProtocol 配置项，仅保留 baseURL
删除 mediaProtocol，使用实例配置
修改 aspectRatio，使用扩展功能手动设置

// 1.x配置方式
playerjs.config = {
	ip: "192.168.1.100",
	port: 21250,
	httpProtocol: "http",
    ...
};
// 或者
playerjs.config = {
	baseURL: "http://192.168.1.100:21250",
    ...
};
// 2.x 配置方式
playerjs.config = {
	baseURL: "http://192.168.1.100:21250",
    ...
};

2.2. 直通

新增 replay 接口，用于恢复已关闭通道

type channelInfo = {
    channel: number;
    devId: string;
};
playerIns.replay(replayList: channelInfo[]);

新增 addstream 接口，用于添加当前设备通道。

type channelInfo = {
    channel: number;
    devId: string;
    dom: HTMLElement;
};
playerIns.addStream(addList: channelInfo[]);

新增 getRenderInfoList 接口，可以通过实例获取到渲染相关信息

const infoList = playerIns.getRenderInfoList();
// 返回数据:
{
    channel: oneRender.channel,			// 渲染通道
    realChannel: oneRender.realChannel, // 真实通道
    index,							    // 渲染顺序
    devId: oneRender.devId,             // 设备ID
    volume: oneRender.volume,           // 当前音量
    domContainer: oneRender.container,  // 父级dom
}

新增 stop 接口

type channelInfo = {
    channel: number;
    devId: string;
};
playerIns.stop(stopList: channelInfo[]); // 如果通道为 undefined，则停止全部

修改 createLivePlayer 接口，由单 dom 改为 domList，参数中去掉 devId、channel，改为 deviceInfos。

// 2.x 创建直通播放
const livePlayer = playerjs.createLivePlayer(domList, {
     deviceInfos: [{
         devId: '设备ID',
         channels: '1'
     }],
     ...
});

修改 destroy 接口，新增按通道释放 - destroy(channel, devId)

type channelInfo = {
    channel: number;
    devId: string;
};
playerIns.destroy(destroyList: channelInfo[]); // 如果通道为 undefined，则停止全部

修改属性 volume，新增按通道设置 - volume = [{ devId: "divId", channel: channel, volume: 0.2 }];

playerIns.volume = [{ devId: 'divId', channel: channel, volume: 0.2 }];

修改属性 status。

const status = playerIns.status;
// 返回数据格式：
{
    state: "newIns",
    info: {
        oneDev: devInfo,
        channel: oneChan,
    },
}

修改 aspectRatio 接口，设置画面播放比例统一按扩展功能接入

const value = 'origin';
const channel = 0; // 为 0，则更新全部
playerIns.pluginMap.aspectRatio.set(value, channel: number, devId?: string);

修改主子码流切换接口，原有字符串改为数组或者字符串，字符串为全部设置

type channelInfo = {
    channel: number;
    devId: string;
    streamType: string;
};
setStreamType(streamTypeList: channelInfo[] | "MAJOR" | "MINOR");

2.3. 回放

删除属性 PlayerStatus
删除 stopAll，如需关闭所有，stop 中通道不传或传 0 即可。
删除 destroyAll，如需释放所有，stop 中通道不传或传 0 即可。
删除 getMediaElement 方法、mediaElements 属性、channelPlayers 属性
新增 getRenderInfoList 接口，以替代上述删除接口。(参考直通 getRenderInfoList 接口)
修改 createHistoryPlayer 接口，删除原来 timeList 参数，改 fileList 为必填、删除 timeZoneOffset

const playerIns = playerjs.createHistoryPlayer(domList, {
    fileList: fileListData,
    ...
});

修改逐帧接口方式，由原来扩展功能式接口改为实例方法，新增 nextFrame、prevFrame 方法

const step = 10;
playerIns.nextFrame(step);

修改 stop、、destroy、destroyAll、resume、pause 接口，取消返回值
修改 seekTo 方法，改为 seek

const dateStr = '2024-04-17 19:00:00';
playerIns.seek(dateStr);

修改 currentTime 属性，取消 setter，仅支持获取当前时间。拖动请使用 seek 方法

const timeNow = playerIns.currentTime;

修改 aspectRatio 接口，设置画面播放比例统一按扩展功能接入
修改主子码流切换接口，原有字符串改为数组或者字符串，字符串为全部设置

type channelInfo = {
    channel: number;
    devId: string;
    streamType: string;
};
setStreamType(streamTypeList: channelInfo[] | "MAJOR" | "MINOR");

2.4. 扩展功能

修改直通扩展功能新增通道号，包括手动马赛克、全屏、电子放大、截图、视频信息功能
辅助工具中取消原回放遍历 channelPlayer 方式，采用统一从最外层 hooks 处理

2.5. HOOKS 事件变更

删除 afterRendererInit、afterControl、afterBufferChange、onAcceptFrameData、beginPlay、afterDestory、afterListenTalkAutoClose、startLoading、stopLoading。
监听对讲设备端关闭由 afterListenTalkAutoClose 改为 onError 回调
新增 beforeSeek、onMediaInfo

playerIns.hooks.beforeSeek.tap('beforeSeek', (playerIns, eventData) => {
    // do something
});

参考如下

名称	触发事件	回调参数
afterPlayerInit	播放器初始化完毕触发	(player, playConfig) 播放器实例、播放配置参数
onChannelRender	通道渲染 AI 参数回调	(param: Frame['param'], renderer: PlayRender) 帧数据 AI 参数，渲染 dom 节点
afterLoaded	成功获取到流数据连接	(player, eventData) 播放器实例、返回的链接数据
afterReady	播放就绪事件，用于用户调用播放	(player, eventData) 播放器实例、返回的播放状态数据
beforePlay	用户调用触发 play	(player, eventData) 播放器实例、下发播放的数据
afterPlay	渲染器开始播放，状态机修改为 playing 状态	(player, eventData) 播放器实例、下发播放的数据
beforePause	用户调用触发 pause	(player, eventData) 播放器实例、下发播放的数据
afterPause	渲染器暂停播放，状态机修改为 paused 状态	(player, eventData) 播放器实例、回调的暂停数据
beforeStop	用户调用触发 stop	(player, eventData) 播放器实例、下发播放的数据
afterStop	渲染器停止播放，状态机修改为 stopped 状态	(player, eventData) 播放器实例、回调停止的数据
beforeSeek	用户调用触发 seek，状态为 seeking 状态	(player, eventData) 播放器实例、下发播放的数据
afterSeek	seek 成功，状态机修改为 playing 状态	(player, eventData) 播放器实例、回调的 seek 的数据
beforeDestroy	用户调用触发 destroy	(player, eventData) 播放器实例、下发 destroy 的数据
onError	错误回调事件	(errorData, player) 标准的 errorData,播放器实例
onPlayEnded	自动播放结束	(player, eventData) 播放器实例、结束的通道信息数据
onLoading	用于回调 loading 时的百分比信息和网速信息，直通和回放通用。	(list, done) 播放器通道状态信息、是否加载数据完毕标志
loadingTimeout	用于判断缓冲超时 (20s)。超时时长和 seek 超时时长保持一致。	(list)
startReconnect	断线后，开始重连的 hook.	(player, eventData) 播放器实例、重连信息
reconnectSuccess	断线后，重连成功的 hook.	(player, eventData) 播放器实例、重连信息
playerStatusToggle	回放通道播放状态变更。与播放器状态需要区分，播放状态是指在播放过程中，通道是有流的播放状态或无流的空闲状态；可配合 placeholder 插件实现自定义无视频时遮罩	(statusList)
onTimeChange	回放播放过程中主动推送时间。推送频率可在 config 中配置，默认 500ms。如果业务层需要时间轴平滑移动，可将频率设置低些，特别是服务器回放的小文件。	(params: [data]) 时间信息
onMediaInfo	媒体信息回调，目前主要包括 timelist（网络流情况下业务层需要感知时长信息）	(player, eventData) 播放器实例、媒体信息

1.X 升级 2.0.1 指南#

1. 优化及功能#

1.1. 优化项#

1.2. 直通复用#

1.3. 基于 S17-FMS 云存储回放播放#

1.4. 基于网络流 url 播放#

1.5. N9M 设备直连播放#

1.6. 基于 S17 播放回放支持多种 Seek 方式#

1.7.基于 S17 播放回放支持 H5 私有协议播放#

2. 接口变更#

2.1. 全局配置#

2.2. 直通#

2.3. 回放#

2.4. 扩展功能#

2.5. HOOKS 事件变更#

1.X 升级 2.0.1 指南

1. 优化及功能

1.1. 优化项

1.2. 直通复用

1.3. 基于 S17-FMS 云存储回放播放

1.4. 基于网络流 url 播放

1.5. N9M 设备直连播放

1.6. 基于 S17 播放回放支持多种 Seek 方式

1.7.基于 S17 播放回放支持 H5 私有协议播放

2. 接口变更

2.1. 全局配置

2.2. 直通

2.3. 回放

2.4. 扩展功能

2.5. HOOKS 事件变更