AnyChat SDK for Web 开发流程指南 - AnyChat技术支持论坛

JavaScript的开发工具有很多，开发者可根据自己的喜好进行选择。在此，我们推荐开发者使用dreamwaver作为自己的开发工具，本套开发指南也是针对dreamwaver开发环境下进行编写的。

一、安装AnyChat Web插件
AnyChat for Web SDK包中提供了一个ActiveX插件（如果您自己有ActiveX代码签名证书，可对SDK包bin\AnyChatWeb目录中的“npanychatweb.dll”和“npvideoshowctrl”插件进行签名，具体操作参考bin下面的readme.txt文件），AnyChat Web SDK提供的所有JavaScript接口都是基于这个插件实现。在使用AnyChat Web SDK接口进行通讯之前,需要确保插件已经安装成功。安装插件的步骤如下：
(1) 打开解压后的SDK包下的bin目录，双击AnyChatWebSetup.exe程序进行安装，安装的过程中可以选择安装路径，如下图所示：

(2)按照提示，单击“下一步”按钮，即可完成插件的安装。

二、导入SDK文件
(1)将解压后的sdk包下src\sdk目录的anychatsdk.js文件拷贝到网页工程的相应的目录下面，我的目录结构如下图所示：

(2)在需要使用AnyChat Web SDK接口的网页中引入anychatsdk.js,参考代码如下：

<head>
<title>AnyChat for Web SDK Demo</title>
<script language="javascript" type="text/javascript" src="./javascript/anychatsdk.js" charset="GB2312"></script>
</head>

复制代码

  三、基本流程
   在工程准备好了之后，需要实现以下基本流程，才能调用音视频交互等其他功能接口，才能调用音视频交互等其他功能接口。

   3-1.监听基本事件
   监听“连接服务器、用户登录、进入房间、与服务器网络连接”等事件。

   (1)将SDK包下src\AnyChatWebDemo\javascript\anychatevent.js拷贝到网页工程相应目录下，并在网页中加载anychatevent.js文件，参考代码如下：

<head>
<script language="javascript" type="text/javascript" src="./javascript/anychatevent.js" charset="GB2312"></script>
</head>

复制代码

(2)在anychatevent.js的函数体中可以添加上层需要处理的代码，不需要的函数可以删除。在相应的条件下内核会自动执行anychatevent.js的相应函数，参考代码如下：

// 异步消息通知，包括连接服务器、登录系统、进入房间、网络掉线等消息
function OnAnyChatNotifyMessage(dwNotifyMsg, wParam, lParam) {
switch(dwNotifyMsg) {
case WM_GV_CONNECT:
OnAnyChatConnect(wParam, lParam);break;
case WM_GV_LOGINSYSTEM:
OnAnyChatLoginSystem(wParam, lParam);break;
case WM_GV_ENTERROOM:
OnAnyChatEnterRoom(wParam, lParam);break;
case WM_GV_ONLINEUSER:
OnAnyChatRoomOnlineUser(wParam, lParam);break;
case WM_GV_USERATROOM:
OnAnyChatUserAtRoom(wParam, lParam);break;
case WM_GV_LINKCLOSE:
OnAnyChatLinkClose(wParam, lParam);break;
default:
break;
}

复制代码

3-2.初始化SDK
加载插件资源，其他的功能接口都必须在初始化成功之后才能正常使用。可以放在需要使用AnyChat功能的网页onload事件中延时(setTimeout)调用。如果初始化失败，可能是没有安装插件或者插件版本太老，可以提示客户需要安装插件并提供插件下载链接，并启动定时器不断调用初始化，直到用户安装插件成功。参考代码如下：

function loadAnyChat(){
setTimeout(function () {
//刷新网页加载插件列表
if (navigator.plugins && navigator.plugins.length) {
window.navigator.plugins.refresh(false);
}
var errorcode=BRAC_InitSDK(0);
if(errorcode==0){
//初始化成功，清除插件安装检测定时器
if(mRefreshPluginTimer != -1){
clearInterval(mRefreshPluginTimer); }
else{
if(errorcode==GV_ERR_PLUGINNOINSTALL){
//初始化失败，需要安装插件,提供插件下载链接给客户
}
else if(errorcode==GV_ERR_PLUGINOLDVERSION){
//初始化失败，当前插件的版本过低，请下载安装最新版本
}
if(mRefreshPluginTimer == -1) {
mRefreshPluginTimer = setInterval(function(){ LogicInit(); }, 1000);
}
}
}, 500);
}
window.onload = loadAnyChat;

复制代码

3-3.连接、登录服务器
使用AnyChat功能的通讯功能，必须要先连接登录AnyChat的通讯服务器，这里以我们对外公开测试服务器地址demo.anychat.cn为例，参考代码如下：

// 连接服务器,第一个参数为你需要连接的视频服务器地址，如果您部署视频服务器的地址为192.168.1.8，则传人这个地址
BRAC_Connect("demo.anychat.cn", 8906);
//登录服务器
BRAC_Login("AnyChat", "", 0);

复制代码

这两个流程的执行都是异步的操作，会触发相应的OnAnyChatConnect、OnAnyChatLoginSystem函数。

3-4.进入房间
应用层将roomid传入,进入指定的房间。只有在同一个房间内的用户才能进行音视频通讯，参考代码如下：

//第一个参数为房间号，可传入任意正数
BRAC_EnterRoom(1, "", 0);

复制代码

进入房间的操作是一个异步的操作，会依次触发anychatevent.js的OnAnyChatEnterRoom、OnAnyChatRoomOnlineUser回调（参考4.1）