appcan利用天翼rtc实现视频通话功能
本代码是在示例代码的基础上进行了一些简化,并将其单独做了一个 vedio.js 文件,只需要两个按钮,即可完成接听和拨打的需求
attention:
- 默认将用户名设置成 1234,拨打的帐号设置成 4321,如果需要使用一个 app 实现的话,具体逻辑自行修改
代码:
/**
* 视频功能实现
* 使用天翼rtc插件实现
*/
/**
* 初始化,在页面初始化方法中调用这个函数
* 定义天翼rtc回调函数
* 同一个页面中 appcan.ready可以存在多个,不会冲突;而uexOnload不行...
*/
function rtcInit() {
uexESurfingRtc.onGlobalStatus = upgateGlobalStatus; //全局监控
uexESurfingRtc.cbLogStatus = upgateLogStatus; //登陆回调
uexESurfingRtc.cbCallStatus = updateCallStatus; //呼叫回调
//uexESurfingRtc.cbRemotePicPath = showRemotePicPath;//截屏回调
/*----------配置天翼rtc插件的appkey & appid---------*/
appId = "70392";
appKey = uexESurfingRtc.setAppKeyAndAppId(appKey, appId); //输入你自己的appKey;
}
/**
* 登陆回调,返回是否登陆成功
*/
function upgateLogStatus(opCode, dataType, data) {
//alert(data);
if ("OK" == data.substring(0, 2)) {
var status = data.split("OK:")[1];
var showStr = "";
if ("LOGIN" == status) {
showStr = "登陆成功,点击退出";
$("#login").attr("name", "logout");
} else if ("LOGOUT" == status) {
showStr = "登陆";
$("#login").attr("name", "login");
}
$("#login").text(showStr);
} else {
alert(data);
}
}
function updateCallStatus(opCode, dataType, data) {
alert(data);
if ("OK" == data.substring(0, 2)) {
var status = data.split("OK:")[1];
var showStr = "";
if ("NORMAL" == status) {
showStr = "call";
} else if ("INCOMING" == status) {
showStr = "accept";
}
// else if("CALLING" == status)
// {
// showStr = "Calling";
// }
$("#call").attr("name", showStr);
$("#call").text(showStr);
} else {
alert(data);
}
}
/**
*监控中心回调
*/
function upgateGlobalStatus(opCode, dataType, data) {
$("#content").append(data);
}
/**
* 登陆方法的实现
*
*/
function login() {
// alert(123);
/*--设置登陆的配置,分别是本地窗口和对方视频窗口的大小----*/
jsonViewConfig = {
localView: {
x: "10",
y: "800",
w: "432",
h: "528",
},
remoteView: {
x: "440",
y: "800",
w: "432",
h: "528",
},
};
/*---这里默认设置一个用户名用于调试,后期用户登录之后直接自动生成---*/
userName = "1234";
/*--uexESurfingRtc.login函数需要传入的参数是一个json字符串,所以需要调用JSON.stringify方法将json对象转换为字符串--*/
jsonDtr = JSON.stringify(jsonViewConfig);
uexESurfingRtc.login(jsonDtr, userName);
}
/**
* 退出登录
* @return {[type]} [description]
*/
function logout() {
uexESurfingRtc.logout();
}
function call() {
uexESurfingRtc.call("3", "4321");
}
function accept() {
uexESurfingRtc.acceptCall("3");
}
/**
*登陆按钮
*点击之后直接视频登陆
*/
appcan.button("#login", "ani-act", function () {
var btnName = $("#login").attr("name");
if (btnName == "login") {
$("#login").text("登陆中,请稍候...");
login();
} else if ((btnName = "logout")) {
$("#login").text("退出中,请稍候...");
logout();
}
});
/**
* 呼叫按钮
*/
appcan.button("#call", "ani-act", function () {
var btnName = $("#call").attr("name");
if (btnName == "call") {
$("#call").text("呼叫中,请稍候...");
call();
} else if ((btnName = "accept")) {
$("#call").text("接听中,请稍候...");
accept();
}
});
本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!