论坛 › TRTC 实时音视频 › 页面应用JS接入TRTC 实时音视频 实现实时通话或者会议

陈家粉儿 发表于 2020-5-27 16:28:29

页面应用JS接入TRTC 实时音视频 实现实时通话或者会议

页面应用JS接入TRTC 实时音视频   实现实时通话或者会议

♦ 腾讯云官方参考资料：♦ TRTC实时音视频♦ 产品文档♦ 服务器端API♦ 客户端API♦ 用腾讯平台提供的 SecretKey 在服务器端计算 UserSig
setListener 设置监听器
//所有事件请参考 TRTCCloudListener
//详细说明 http://doc.qcloudtrtc.com/group__TRTCCloud__android.html#a22fe2f31f2ef62fb3c6cba083dc6c016
//所有事件 http://doc.qcloudtrtc.com/group__TRTCCloudListener__android.html#classcom_1_1tencent_1_1trtc_1_1TRTCCloudListener
jsBridge.trtc.setListener(function(event, data) {
show({
    event: event,
    data : data
});
});

//请拉到页面底部查看回调数据信息
$('html,body').animate({ scrollTop: $('#view').offset().top }, 500);

/**
回调参数说明：
event - 事件名称，字符串类型
data- 事件数据，JSON 对象，即事件回调参数
**/

removeListener 移除监听器
//移除监听器，不会再收到回调通知
//在需要时可重新调用 setListener
jsBridge.trtc.removeListener();

enterRoom 进入房间1 - 测试用户 A
• 需要开启文件读写、摄像头和麦克风隐私权限；
//进入房间1 - 测试用户 A
//进入房间，若房间不存在，系统将自动创建一个新房间。
//详细说明 http://doc.qcloudtrtc.com/group__TRTCCloud__android.html#abfc1841af52e8f6a5f239a846a1e5d5c
jsBridge.trtc.enterRoom({
param: {
    //必须，数字类型，腾讯平台上创建的应用ID
    sdkAppId: 1400361045,
    //必须，字符串类型，用户ID
    userId: "user_A",
    //必须，字符串类型，用户安全签名
    //如何计算UserSig 请参考 https://cloud.tencent.com/document/product/647/17275#Server
    userSig : "eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS80oy0zLBwqXFqUXxjlCZ4pTsxIKCzBQlK0MTAwNjM0MDE1OITGpFQWZRqpKVsSFQzMDAACJakpkLFDM0tbAwsDAwNTCCmpKZDjTYNCkkM8jL09es0tc9z8jczCgrsjLKyS3JX7sk1dPb3cWyKqQ8IDcnKK0i3VapFgBHbDGE",
    //必须，数字类型，房间号，进入同一个房间号的用户可以共同通话
    roomId: 1
},
//可选，其他设置
extra: {
    //可选，字符串类型，房间名称（标题），默认为数字房间号，空字符串 "" 则不显示
    title    : "这是房间名称",
    //可选，布尔类型，是否横屏模式，默认 false（竖屏）
    landscape: false,
    //可选，布尔类型，是否录屏作为视频源，默认 false（使用摄像头），true 则录屏
    captureScreen: false,
    //可选，数字类型，视频分辨率，默认 0（360x640），允许的值：
    //0 分辨率360x640
    //1 分辨率240x320
    //2 分辨率540x960
    //3 分辨率720x1280
    videoResolution: 0,
    //可选，布尔类型，是否使用16K音频采样率，默认 false（48K）
    audio16KSampleRate: false,
    //可选，数字类型，音量类型，默认 0（自动），允许的值：
    //0 自动
    //1 媒体
    //2 通话
    volumeType: 0,
    //可选，布尔类型，是否拒收（不接收）视频，默认 false（接收视频）
    rejectVideo: false,
    //可选，布尔类型，是否拒收（不接收）音频，默认 false（接收音频）
    rejectAudio: false
}
}, function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});

enterRoom 进入房间1 - 测试用户 B
//进入房间1 - 测试用户 B
jsBridge.trtc.enterRoom({
param: {
    sdkAppId: 1400361045,
    userId: "user_B",
    userSig : "eJwtzEsLgkAUhuH-ctYhZ7w1CC2aAjcukqJtlGfSk1jDjNqN-nuiLr-ng-cLh2zv9dpCAr6HsBg3k763fOWRO6ftSc2Po-psDBMkIkQMYoFhND36ZdhqSAIxGCJO2nIzmIikRInLMJ4rXA7ho1Id9lS3TUTZujB*ReknkJfyYd7b4nnbVanb5KSsy1fw*wNubjKq",
    roomId: 1
}
}, function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});


enterRoom 进入房间1 - 测试用户 C
//进入房间1 - 测试用户 C
jsBridge.trtc.enterRoom({
param: {
    sdkAppId: 1400361045,
    userId: "user_C",
    userSig : "eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS80oy0zLBwqXFqUXxzlCZ4pTsxIKCzBQlK0MTAwNjM0MDE1OITGpFQWZRqpKVsSFQzMDAACJakpkLFDM0tbAwsDAwN7eEmpKZDjQ4Kzfd2SLKPEvbyz*qIjw9J9fT2Diz3EPb29KkxMk8L1I7yz-ItVQ-Lc001FapFgBTWTEi",
    roomId: 1
}
}, function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});

enterRoom 进入房间2 - 测试用户 A
//进入房间2 - 测试用户 A
jsBridge.trtc.enterRoom({
param: {
    sdkAppId: 1400361045,
    userId: "user_B",
    userSig : "eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS80oy0zLBwqXFqUXxjlCZ4pTsxIKCzBQlK0MTAwNjM0MDE1OITGpFQWZRqpKVsSFQzMDAACJakpkLFDM0tbAwsDAwNTCCmpKZDjTYNCkkM8jL09es0tc9z8jczCgrsjLKyS3JX7sk1dPb3cWyKqQ8IDcnKK0i3VapFgBHbDGE",
    roomId: 123
}
}, function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});

enterRoom 进入房间2 - 测试用户 B
//进入房间2 - 测试用户 B
jsBridge.trtc.enterRoom({
param: {
    sdkAppId: 1400361045,
    userId: "user_B",
    userSig : "eJwtzEsLgkAUhuH-ctYhZ7w1CC2aAjcukqJtlGfSk1jDjNqN-nuiLr-ng-cLh2zv9dpCAr6HsBg3k763fOWRO6ftSc2Po-psDBMkIkQMYoFhND36ZdhqSAIxGCJO2nIzmIikRInLMJ4rXA7ho1Id9lS3TUTZujB*ReknkJfyYd7b4nnbVanb5KSsy1fw*wNubjKq",
    roomId: 123
}
}, function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});

enterRoom 进入房间2 - 测试用户 C
//进入房间2 - 测试用户 C
jsBridge.trtc.enterRoom({
param: {
    sdkAppId: 1400361045,
    userId: "user_C",
    userSig : "eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS80oy0zLBwqXFqUXxzlCZ4pTsxIKCzBQlK0MTAwNjM0MDE1OITGpFQWZRqpKVsSFQzMDAACJakpkLFDM0tbAwsDAwN7eEmpKZDjQ4Kzfd2SLKPEvbyz*qIjw9J9fT2Diz3EPb29KkxMk8L1I7yz-ItVQ-Lc001FapFgBTWTEi",
    roomId: 123
}
}, function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});

enterRoom 进入房间2 - 测试用户 C：横屏模式
//横屏模式
jsBridge.trtc.enterRoom({
param: {
    sdkAppId: 1400361045,
    userId: "user_C",
    userSig : "eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS80oy0zLBwqXFqUXxzlCZ4pTsxIKCzBQlK0MTAwNjM0MDE1OITGpFQWZRqpKVsSFQzMDAACJakpkLFDM0tbAwsDAwN7eEmpKZDjQ4Kzfd2SLKPEvbyz*qIjw9J9fT2Diz3EPb29KkxMk8L1I7yz-ItVQ-Lc001FapFgBTWTEi",
    roomId: 123
},
extra: {
    landscape: true
}
}, function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});

enterRoom 进入房间2 - 测试用户 C：录屏
//录屏
jsBridge.trtc.enterRoom({
param: {
    sdkAppId: 1400361045,
    userId: "user_C",
    userSig : "eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS80oy0zLBwqXFqUXxzlCZ4pTsxIKCzBQlK0MTAwNjM0MDE1OITGpFQWZRqpKVsSFQzMDAACJakpkLFDM0tbAwsDAwN7eEmpKZDjQ4Kzfd2SLKPEvbyz*qIjw9J9fT2Diz3EPb29KkxMk8L1I7yz-ItVQ-Lc001FapFgBTWTEi",
    roomId: 123
},
extra: {
    captureScreen: true
}
}, function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});

exitRoom 离开房间
//离开房间
//详细说明 http://doc.qcloudtrtc.com/group__TRTCCloud__android.html#a41d16a97a9cb8f16ef92f5ef5bfebee1
jsBridge.trtc.exitRoom(function(succ, data) {
if (!succ) {
    alert(JSON.stringify(data));
}
});

startSpeedTest 开始进行网络测速
//开始进行网络测速
//请先调用 setListener 接口，在回调参数 data.event == "onSpeedTest" 中获取测试结果；
//详细说明 http://doc.qcloudtrtc.com/group__TRTCCloud__android.html#a0dbceb18d61d99ca33e967427dd0a344
jsBridge.trtc.startSpeedTest({
sdkAppId: 1400361045,
userId: "user_A",
userSig : "eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS80oy0zLBwqXFqUXxjlCZ4pTsxIKCzBQlK0MTAwNjM0MDE1OITGpFQWZRqpKVsSFQzMDAACJakpkLFDM0tbAwsDAwNTCCmpKZDjTYNCkkM8jL09es0tc9z8jczCgrsjLKyS3JX7sk1dPb3cWyKqQ8IDcnKK0i3VapFgBHbDGE",
}, function(succ, data) {
if (succ) {
    alert("已开始");
} else {
    alert(JSON.stringify(data));
}
});

stopSpeedTest 停止服务器测速
//停止服务器测速
//详细说明 http://doc.qcloudtrtc.com/group__TRTCCloud__android.html#a3e862cef0e818ddecdc3dc4d66a6f8f9
jsBridge.trtc.stopSpeedTest(function(succ, data) {
if (succ) {
    alert("已停止");
} else {
    alert(JSON.stringify(data));
}
});

getSDKVersion 获取 SDK 版本信息
//获取 SDK 版本信息
jsBridge.trtc.getSDKVersion(function(succ, data) {
alert(JSON.stringify(data));
});

查看完整版本: 页面应用JS接入TRTC 实时音视频 实现实时通话或者会议