# 快速开始

# 安装

Manis Web SDK 3+ 将公共依赖库独立出来，需要在引入SDK文件前先行引入. 主要依赖有：

adapter.js (opens new window), 最新稳定版是v7.2.5，开发本SDK时主要用到的是v7.0.0，可以酌情参考使用。
socket.io.js (opens new window), 最新稳定版本是v3.0.3开发本SDK时主要用的是v2.3.0版本，可酌情参考

从官方渠道获取Manis Web SDK 3+的SDK包，在引入上述依赖库之后引入SDK文件.

<script type="application/javascript" src="manis_web_sdk_hash_v3.x.x.min.js"></script>

所有包引入成功之后，就可以开始着手使用了，只需要跟着下面简单几步，就可以快速接入到频道并构建音视频通讯了。

# 初始化

使用Manis.createClient(options)创建客户端实例，

options为javascript字典对象，有如下成员属性；返回一个客户端实例对象

名称	类型	说明	备注
host	string (opens new window)	连接系统服务器地址(域名、IP地址)
accessKey	string (opens new window)	用户授权字符换	在个人中心->AccessKey页面创建密钥对
accessSecret	string (opens new window)	用户授权密钥	在个人中心->AccessKey页面创建密钥对
appId	string (opens new window)	应用标识唯一字符串	appId:登录到系统之后,在项目管理中新建获得

示例：

const client = Manis.createClient({
    host: 'hostServer'
    accessKey: 'accessKey',
    accessSecret: 'accessSecret',
    appId: 'appId'
})

# 加入频道

使用Promise (opens new window) Manis.join(channel, nickname)加入到频道，

接收两个参数，channel和nickname，返回一个Promise对象实例

名称	类型	说明	备注
channel	string (opens new window)	需要加入的频道ID	通过服务端接口获取得到
nickname	string (opens new window)	加入频道后显示的用户昵称

示例：

let channel = '00001'
let nickname = '参会者_xxx'
Manis.join(channel, nickname).then(res => {
    console.log('joinSuccess: ', res)
    // @TODO 加入频道成功之后应立即注册监听事件, 如果室加入到一个已经有用户的频道, 则会返回频道中已有的流媒体信息
    if (res.remoteStreams && res.remoteStreams.length) {
        for (let i = 0; i < res.remoteStreams.length; i++) {
            let remoteStream = res.remoteStreams[i]
            _this.subscribe(remoteStream) // 使用该媒体信息,调用订阅方法订阅频道中的流媒体
        }
    }
}).catch(err => {
	console.log('joinFailed: ', err)
})

注意：在调用加入频道返回成功之后，应立即订阅事件，以备即时收到频道内的事件推送。也可以在初始化完成之后就完成事件订阅

# 注册用户加入/离开频道事件

使用Manis.userJoined(callback)有用户加入到频道，

接收一个回调函数，回调函数中返回加入频道的远端用户实例joinUser，并且在返回的用户实例上用joinUser.addEventListener('left'， callback)添加用户离开频道的事件监听

名称	类型	说明	备注
callback	function (opens new window)	有远端用户加入到频道的事件回调	回调函数中返回用户实例

示例：

/*订阅有用户进入频道*/
Manis.userJoined(joinUser => {
    console.log('handleUserJoined', joinUser)
    if (joinUser) {
        /*注册此用户离开频道事件回调*/
        joinUser.addEventListener('left', leftEvent => {
            console.log('handleUserLeft: ', joinUser, leftEvent)
        })
    }
})

注意：注册订阅应该在加入频道之后即刻完成或者在初始化完成之后就完成订阅注册。需要在返回的用户实例上增加用户离开频道的监听才能接收到用户离开频道的通知

# 注册有用户往频道中推送流媒体

使用Manis.userPublished(callback)监听有用户推送流媒体到频道中，

接收一个回调函数，回调函数中返回接收到的远端用户推送的流媒体信息，使用该信息调用后面的订阅方法就可以订阅到频道中对应的流媒体并渲染。

名称	类型	说明	备注
callback	function (opens new window)	有远端用户推送流媒体到频道	回调函数中返回远端流媒体信息

示例：

/*监听有流媒体接入*/
Manis.userPublished(res => {
    console.log('handleUserPublishStream: ', remoteStream)
    if (remoteStream) {
    	_this.subscribe(remoteStream) 
       // @TODO 使用该媒体信息,调用订阅方法订阅频道中的流媒体
    }
})

注意：返回的媒体信息还不是完整的流媒体资源,使用该媒体信息,通过调用订阅媒体方法可以更灵活方便的分别订阅媒体频道中的音视频等流媒体资源

# 订阅流媒体

使用Promise (opens new window)Manis.subscribe(remoteStream, subscribeOptions)订阅上一步获取到的媒体信息中的媒体资源，

接收媒体资源信息remoteStream和可选参数订阅选项subscribeOptions，返回一个Promise对象实例

名称	类型	说明	备注
remoteStream	Object (opens new window)	频道中远端流媒体信息	加入频道和用户推送流媒体事件中都会回调
subscribeOptions	Object (opens new window)	订阅选项	默认为音视频都订阅

示例：

/*监听有流媒体接入*/
const subscribeOptions = {audio: true, video: true}
Manis.subscribe(remoteStream, subscribeOptions).then(remote => {
    console.log('handleSubscribeRemoteStreamSuccess: ', remote)
    // 其中remote.stream就是我们需要渲染到页面的流媒体资源
}).catch(err => {
    console.error('handleSubscribeRemoteStreamFailed: ', err)
})

注意：返回的媒体信息还不是完整的流媒体资源,使用该媒体信息,通过调用订阅媒体方法可以更灵活方便的分别订阅媒体频道中的音视频等流媒体资源

完成上述一些列注册订阅的方法之后,就可以构建本地流媒体并推送到频道中

# 构建本地流媒体

使用Promise (opens new window)Manis.createMicrophoneAndCameraTracks()构建本地基于摄像头和麦克风的流媒体资源，

接收两个可选参数:音视频约束对象,返回一个Promise对象实例

名称	类型	说明	备注
audioOptions	Object (opens new window)	音频约束条件 (opens new window)	可选
videoOptions	Object (opens new window)	视频约束条件 (opens new window)	可选

示例：

/*创建本地音视频媒体*/
Manis.createMicrophoneAndCameraTracks().then(stream => {
    _this.localStream = stream
    console.log('getLocalStream: ', _this.localStream)
    if (_this.localStream) {
        //@TODO 使用下面的推流方法将本地音视频媒体推送到频道
    }
}).catch(error => {
    console.error(error)
})

# 推送本地流媒体

使用Promise (opens new window)Manis.createMicrophoneAndCameraTracks()构建本地基于摄像头和麦克风的流媒体资源，

接收媒体资源信息remoteStream和可选参数订阅选项subscribeOptions，返回一个Promise对象实例

名称	类型	说明	备注
localStream	Object (opens new window)	本地流媒体资源

示例：

/*将构建的本地流媒体推送到频道*/
Manis.publish(localStream).then(resp => {
    console.log('handleLocalStreamPublished: ', resp)
}).catch(error => {
    console.error('handleLocalStreamPublishFailed: ', error)
})

← Manis Web SDK 3.0.0 频道操作 →