本文以麦下观众点击连麦成员进行进一步互动为例,介绍如何通过SEI消息获取麦上成员的视频画面的位置流程。
背景信息
旁路直播会在转码后的H.264/H.265的SEI(Supplemental Enhancement Information)中,增加当前视频的编码信息,用于直播场景中的各类互动场景,其中包含房间内媒体画面的布局信息。麦下观众可以通过该信息获取到麦上成员在视频画面中的位置信息。
开启开关
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);
}
}
信息格式
麦下观众进入直播间后,可以通过SEI监听回调,在type为5时,获取视频布局的SEI信息,信息格式如下:
说明 下示代码中,
canvas
对应推流画布的大小,stream
对应麦上每个成员(含主播)的userId
以及位置信息。业务方可以根据该位置信息,做上层的业务定制逻辑处理。{
"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"
}