通过SEI消息实现连麦过程中的互动

背景

旁路直播会在转码后的 H.264/H.265 的 SEI(Supplemental Enhancement Information)中,增加当前视频的编码信息,用于直播场景中的各类互动场景,其中包含房间内媒体画面的布局信息。 麦下观众可以通过该信息获取到麦上成员在视频画面中的位置信息。

本文通过麦下观众点击连麦成员进行进一步互动举例,介绍通过SEI消息获取麦上成员的视频画面的位置流程。

如何监听SEI回调

联系技术支持开启开关

该功能默认是关闭的,如果开启,需要把AppId提供给技术支持进行申请开通。

播放器设置回调

android示例代码:

PlayerConfig config = mAliPlayer.getConfig();
config.mEnableSEI = true;
mAliPlayer.setConfig(config);
mAliPlayer.setOnSeiDataListener(new IPlayer.OnSeiDataListener() {
 @Override
 public void onSeiData(int type, byte[] bytes) {
 // 此处获取SEI回调
 }
});

iOS示例代码:

AVPConfig *config = [[AVPConfig alloc] init];
config.enableSEI = YES; // 打开SEI监听
... 
 
_player = [[AliPlayer alloc] init];
[_player setConfig:config];
_player.delegate = self;
... 

// 通过player的回调事件进行处理SEI数据
- (void)onSEIData:(AliPlayer *)player type:(int)type data:(NSData *)data {
 // 接收来之混流的SEI数据,type为5
 if (type == 5) {
 NSString *str = [NSString stringWithUTF8String:data.bytes];
	 NSData *strData = [str dataUsingEncoding:NSUTF8StringEncoding];
 NSError *jsonError = nil;
	 NSDictionary *dict = [NSJSONSerialization JSONObjectWithData:strData options:0 error:&jsonError];
 NSLog(@"混流SEI字典数据:%@", dict);
 }
}

作为麦下观众,进入直播间后,可以通过该回调,在type为5时,获取视频布局的SEI信息,信息格式如下。

{
 "canvas": {
 "bgnd": 0,
 "h": 1280,
 "w": 720
 },
 "stream": [
 {
 "h": 0.22890624,
 "ms": 0,
 "paneid": 0,
 "type": 0,
 "uid": "Harold3",
 "vad": 16,
 "vol": 39,
 "w": 0.40694445,
 "x": 0.090277776,
 "y": 0.1921875,
 "zorder": 1
 },
 {
 "h": 0.22890624,
 "ms": 1,
 "paneid": 1,
 "type": 0,
 "uid": "Joshua1",
 "vad": 0,
 "vol": 0,
 "w": 0.40694445,
 "x": 0.5013889,
 "y": 0.1921875,
 "zorder": 2
 }
 ],
 "ts": 1676894623891,
 "ver": "1.0.0.20220915"
}

其中,canvas对应推流画布的大小,stream对应麦上每个成员(含主播)的userId以及位置信息。 业务方可以根据该位置信息,做上层的业务定制逻辑处理。