OMCS 开发手册之 Web SDK 说明

      (OMCS  Web SDK 支持所有类型的浏览器,目前OMCS Web版本提供的功能有:语音、视频、远程桌面、电子白板(观看)。) 

  如果您已经了解了OMCS语音视频框架 PC版本的使用方法,那么上手Web版本的SDK是非常简单的。在本文中,我们将Web SDK中重要的API列出来加以说明,很多重复性的内容就不再一一赘述了。

  由于Web 的一些权限问题,我们最终采取服务插件的模式来实现对本地语音视频设备的调用,Web SDK与本地的OMCS视频服务Web插件(以托盘运行)进行通信,OMCS视频服务Web插件则与OMCS Server 服务端交互,这样一来插件就起到了一个桥梁的作用,完成Web 端与 OMCS服务端的互通。

  

一.MultimediaManager类

  在Web客户端中以单例模式提供,可以通过MultimediaManagerFactory类的静态方法GetSingleton()获取该单例的引用

function MultimediaManager() {

   //与多媒体服务器建立连接,并初始化本地多媒体管理器。 
    this.Initialize = function (userID, password, serverIP, serverPort) {
        ...
    }

    //设置是否记录安全日志(多媒体管理器的在线状态、每次连接他人设备的连接器状态)。默认值为false。
    this.SetSecurityLogEnabled = function (value) {
        ...
    }  
  
//[从Owner的角度]Owner发送帧数据给Guest时,通道的选择模型。默认值为P2PChannelFirst。必须在初始化前设置才有效。 P2PDisabled:0 ;P2PChannelFirst:1 this.SetChannelMode = function (value) { ... }
  
//设置是否开启自动重连,默认false 必须Initialize之前设置才有效果 this.SetAutoReconnect = function (value) { ... } //获取连接状态(是否连接成功) this.Connected = function () { ... } // 主动关闭与OMCS服务器的连接,将引发自动重连。 参数:是否重连 this.CloseConnection = function (reconnectNow) { ... }
  
//刚刚从麦克风或自定义声音采集器采集的音频帧(20ms的PCM数据)。 需客户端注入回调 this.AudioCaptured = null; //当与目标媒体服务器的连接断开时,触发此事件。事件参数:目标多媒体服务器的地址。 需客户端注入回调 this.ConnectionInterrupted = null; //当与目标媒体服务器重连成功时,触发此事件。事件参数:目标多媒体服务器的地址。 需客户端注入回调 this.ConnectionRebuildSucceed = null; }
  • 其中最重要的方法 Initialize(userID, password, serverIP, serverPort) 用于与多媒体服务器建立连接,并初始化本地多媒体管理器。
  • 与服务器的连接状态通过ConnectionInterrupted、ConnectionRebuildSucceed 回调方法注入到管理器中,可以监听与服务器TCP连接的状态。

1.摄像头

IMultimediaManager接口中与摄像头设置相关的方法如下:

    // 要使用的摄像头的索引。默认值为0。如果不想使用摄像头,可以设置为-1。可以在运行时动态修改
    this.SetCameraDeviceIndex = function (value) {
        ...
    }
    
    //设置摄像头采集视频的宽度与高度
    this.SetCameraVideoSize = function (width,height) {
        ...
    }
    
    //摄像头的最大帧频。默认值:10。(必须在调用Initialize方法之前设置才有效。)
    this.SetMaxCameraFrameRate = function (value) {
        ...
    }
    //摄像头采集的视频的编码质量。取值0~31,默认值10。取值越小,质量越高。可以在运行时动态修改。 经验:建议取值大于5,当小于5时,带宽占用将数倍增加,而图像质量提升并不太明显。
    this.SetCameraEncodeQuality = function (value) {
        ...
    }
    
    //是否将摄像头集到的视频输出给Guest。 默认值为true。(必须在初始化完成之后设置才有效,可动态修改。) 如果为true,表示输出;否则,表示将采集到的视频数据丢弃,不发送给guest。默认值为true。
    this.SetOutputVideo = function (value) {
        ...
    }   

  • SetCameraVideoSize方法设置要采集摄像头的分辨率,默认为320*240。
  • SetOutputVideo方法用于控制是否将摄像头的图像发送给guest,默认为true。

2.麦克风 

    //要使用的麦克风的索引。如果设置为-1,则表示使用采集声卡得到的声音(win7及以上系统)。该属性的值可以在运行时动态修改。
    this.SetMicrophoneDeviceIndex = function (value) {
        ...
    }
    
    //是否将话筒采集到的音频输出给Guest。(必须在初始化完成之后设置才有效,可动态修改。) 如果为true,表示输出;否则,表示将采集到的音频数据丢弃,不发送给guest。默认值为true。(比如在视频会议中,只将发言人的OutputAudio设为true,以减少带宽和避免杂音)
    this.SetOutputAudio = function (value) {
        ...
    }
  • SetOutputAudio方法用于控制是否将摄像头的图像发送给guest,默认为true。

3.远程桌面

    
    //要使用的桌面屏幕的索引。默认值:0。
    this.SetDesktopIndex = function (index) {
        ...
    }
    
    //输出桌面分辨率的缩小系数。默认值:1。取值范围:大于等于0.1且小于等于1。
    this.SetDesktopZoomCoef = function (value) {
        ...
    }
    
    // 是否将桌面图像输出给Guest。默认值为true。(必须在初始化完成之后设置才有效,可动态修改。)
    this.SetOutputDesktop = function (value) {
        ...
    }
    
    //本地桌面的编码质量。取值0~31,默认值10。取值越小,越清晰。可以在运行时动态修改。
    this.SetDesktopEncodeQuality = function (value) {
        ...
    }
    
    //设置要捕捉的屏幕的区域。 默认为null,则表示捕捉整个屏幕。可以在运行时动态修改。【桌面采集器会将长和宽修正为8的整数倍】
    this.SetDesktopRegion = function (x, y, width, height) {
        ...
    }
  • SetDesktopRegion 方法用于控制是采取屏幕的的区域矩形,以屏幕左上角为原点(0,0),默认为全屏

4.群视频 

    //群聊动态组,加入群聊成功后可以获取该值
    this.ChatGroup = null;   
  
//加入群聊 this.JoinChatGroup = function (groupID) { ... } //退出群聊 this.ExitChatGroup = function (groupID) { ... } //当群组有人加入时触发 参数为 memberID 需客户端注入回调 this.ChatGroupSomeoneJoin = null; //当群组有人退出时触发 参数为 memberID 需客户端注入回调 this.ChatGroupSomeoneExit = null;
  • JoinChatGroup方法 加入到指定的群聊中,ExitChatGroup 退出群聊。
  • ChatGroupSomeoneJoin、ChatGroupSomeoneExit 为群聊组中人员变化时会触发,可以设置回调在客户端具体处理该事件。

二.连接器

 当自己作为Guest,需要访问Owner的摄像头等设备时,就需要使用连接器。

1.DynamicCameraConnector

function DynamicCameraConnector() {

    //当接收到来自Owner的新的一帧图像时,触发此事件。base64信息
    this.NewFrameReceived = null;

    //当与目标设备的连接断开时,触发该事件。
    this.Disconnected = null;

    //当连接对方设备的尝试结束时,触发此事件。事件参数说明了连接的结果。
    this.ConnectEnded = null;
    
    // 在AutoReconnect为true的情况下,当开始自动重连目标多媒体设备时,触发该事件。
    this.AutoReconnectStart = null;
    
    //在AutoReconnect为true的情况下,当自动重连目标多媒体设备失败时,触发该事件。
    this.AutoReconnectFailed = null;
    
    //在AutoReconnect为true的情况下,当自动重连目标多媒体设备成功时,触发该事件。
    this.AutoReconnectSucceed = null;

    //获取是否自动重连
    this.GetAutoReconnect = function () {
        ...
    }
    //获取视频尺寸宽度
    this.GetVideoWidth = function () {
        ...
    }
    //获取视频尺寸高度
    this.GetVideoHeight = function () {
        ...
    }
    
    //Owner是否输出了视频。【对应于Owner端的多媒体管理器的OutputVideo属性】
    this.GetOwnerOutput = function () {
        ...
    }
    
    //与目标设备是否已连接?
    this.GetConnected = function () {
        ...
    }
    
    //获取设备主人的UserID。
    this.GetOwnerID = function () {
        ...
    }    
    
    //设置界面要显示的控件 (一般为img标签)
    this.SetViewer = function (viewer) {
        ...
    }
    
    //设置是否在视频图像上面打印视频的相关信息(视频尺寸、编码质量、帧频)。默认值:false。
    this.SetDisplayVideoParameters = function (value)
    {
        ...
    }
    
    //设置是否自动重连,默认false
    this.SetAutoReconnect = function (value) {
        ...
    }
    
    // 尝试连接目标多媒体设备。
    this.BeginConnect = function (destUserID) {
        ...
    }
    
    //与目标设备断开连接,并释放通道。
    this.Disconnect = function () {
        ...
    }
 
}
  •  调用BeginConnect 方法,以尝试连接目标用户Owner的设置,框架会将回调ConnectEnded来通知连接的结果。(MicrophoneConnector、DynamicDesktopConnector、DynamicWhiteBoardConnector 都同理)
  •  在AutoReconnect 为 true的情况下,AutoReconnectStart 、AutoReconnectFailed 、AutoReconnectSucceed  为自动重连的相关事件,只需注入对应的回调即可。(MicrophoneConnector、DynamicDesktopConnector、DynamicWhiteBoardConnector 都同理)
  •  SetViewer 方法用于设置要显示的控件,一般为img标签控件,它会将收到的base64图像信息绘制到该控件上。

2.MicrophoneConnector

  DynamicCameraConnector相似,就不多赘述了,主要提到以下不同点 

    //获取是否静音
    this.GetMute = function () {
        ...
    }
    
    //设置是否静音 默认false
    this.SetMute = function (isMute) {
    ...
    }
  • 通过SetMute 方法来设置是否静音该连接器

3.DynamicDesktopConnector 

  同样DynamicCameraConnector相似,但它不仅是可以观看Owner端的屏幕,并可进行操作。(远程桌面、远程协助)

    //是否仅仅允许查看远程桌面,但是不能进行操作。 默认值为true。注意:该属性用于guest端控制,前提是Owner端的AllowControl必须为true,才有效;否则,即使WatchingOnly为false,仍然不能操作桌面。
    this.SetWatchingOnly = function (value) {
        ...
    }
    //是否在远程桌面上显示Owner的鼠标光标。默认值为true。 
    this.SetShowMouseCursor = function (value) {
        ...
    }
  • SetWatchingOnly方法来控制是否可以操作Owner端的桌面。
  • SetShowMouseCursor 用于设置是否显示Owner端的鼠标光标,前提是WatchingOnly为true时,该属性设置才有效。

4.DynamicWhiteBoardConnector

  通过DynamicWhiteBoardConnector连接到电子白板,观看白板上的内容。(暂不支持操作白板,仅限于观看模式)

 

三. 关于 OMCS视频服务Web插件

      在网页中运行OMCS Web版的前提是:在当前电脑上已经安装并运行了 OMCS视频服务Web插件,文末将提供该插件的安装包下载。

      OMCS视频服务Web插件运行时,将使用一个TCP端口为OMCS Web SDK提供服务, 默认使用端口 9910。

      正如在接下来的demo中演示的那样,当第一次加载网页时,将会尝试启动Web插件,若启动失败,将提示下载并安装Web插件。

       当Web插件安装完成并运行起来,再次刷新页面,即可正常使用OMCS Web 版功能了。 

 

四. Demo及下载

      我们为 OMCS入门Demo 增加了Web端,详细介绍请参见:OMCS Demo -- 入门Demo Web 版

       Web 版的Demo 可与 OMCS入门Demo  的 PC、Andorid、iOS版完全互通的。

(1) OMCS视频服务Web插件安装包

(2) OMCS 入门Demo Web版源码

 

 

下一篇:OMCS FAQ -- OMCS 常见问题解答

上一篇:OMCS 开发手册(11) -- 深入摄像头、麦克风、扬声器

--------------------------------------------------------------------------------------------------------------------  

下载免费版本的OMCS以及 demo源码

阅读 更多OMCS开发手册系列文章

Q Q:168757008

官网: www.oraycn.com

导航

首页

官方网站

联系我们

立即咨询 

站内搜索

ESFramework 通信框架

价目表

详细说明

SDK与Demo下载

ESFramework FAQ

版本变更记录

OMCS 语音视频框架

价目表

详细说明

SDK与Demo下载

OMCS FAQ

版本变更记录

OrayTalk 企业即时通讯系统

价目表

详细说明

客户端下载

OVCS 视频会议系统

详细说明

源码下载

傲瑞实用组件

价目表

SDK下载

NPusher 推流组件

NPuller   拉流组件

MCapture 语音视频采集组件

MFile 语音视频录制组件

MPlayer 语音视频播放组件

OAUS 自动升级系统

StriveEngine 轻量级的通信引擎

傲瑞组件 FAQ

授权

授权流程

产品选购指南

授权方案说明

授权SDK使用说明

其它

支持国产OS、国产CPU、国产DB

SDK使用技巧

联系我们