krtc-web-sdk v0.0.4

新手入门

实时音视频（KRTC） 是由科大未来云提供的一套低延时、高质量的音视频通讯服务，致力于为客户提供稳定、可靠和低成本的音视频传输能力。您可以使用该服务快速构建“视频通话”、“在线教育”、“直播连麦”、“在线会议”等对通信延时要求比较苛刻的音视频应用。

科大未来实时音视频（Real-Time Communication，KRTC），将科大未来多年来在网络与音视频技术上的深度积累，以多人音视频通话和低延时互动直播两大场景化方案，通过科大未来云服务向开发者开放，致力于帮助开发者快速搭建低成本、低延时、高品质的音视频互动解决方案。

多人音视频通话方案 依靠科大未来云覆盖全球的专线网络，全球均可互通，提供覆盖手机、桌面全平台的客户端 SDK 以及云端 API，终端用户还可以在微信、QQ、企业微信的小程序中使用 KRTC 服务，Web 网页也可轻松使用。 低延时互动直播方案 凭借行业领先的网络与音视频技术，结合科大未来云优质的节点资源，帮助开发者搭建卡顿率更低、延时1秒以内的互动直播，让直播走进 CDN 2.0 时代。

Web

本文主要介绍如何快速地将科大未来云 KRTC Web SDK 集成到您的项目中。

准备工作

集成 KRTC Web SDK 之前需要了解的事项。

支持的平台

KRTC Web SDK 基于 WebRTC 实现，目前支持桌面端和移动端的主流浏览器

桌面端支持 Chrome、Firefox、Safari、Opera、IE11、Edge 等浏览器。 移动端支持 Android、iOS、Windows Phone 等浏览器。

URL 域名协议限制

由于浏览器安全策略的限制，使用 WebRTC 能力对页面的访问协议有严格的要求，请参照以下表格进行开发和部署应用。

开始集成

SDK 提供了 UMD、ES Module 类型的模块，满足在不同类型项目中集成。

npm集成

1. 您需要在项目中使用 npm 安装 krtc-web-sdk 包。

   npm install krtc-web-sdk --save

2. 在项目脚本里引入模块

   import KRTC from 'krtc-web-sdk';

Script 集成

1. 在您的 Web 页面中添加如下代码即可

   <script src="./krtc-web-sdk.min.js"></script>

2. 在脚本中通过 KRTC 命名空间访问 API。

   const KRTC = window.KRTC;
   
   KRTC.init()
   ...

API 概览

KRTC 包含以下方法:

api 详情

1. init

   初始化 SDK，必须在页面加载完成后调用。

   参数：

   名称	类型	说明
   config	Object	初始化配置

   config 参数说明：

   名称	类型	说明
   appId	String	应用 ID
   appSecret	String	应用 Key
   userId	String	登录用户的ID

   返回：Promise 对象

   KRTC.init({
       appId: '54156685',
       appSecret: 'dds5f5454dsafdsf',
       userId: '123456789'
   }).then(() => {
       console.log('init success');
   }).catch(err => {
       console.log(err);
   });

2. login

   登录，必须在初始化完成后调用。

   参数：null

   返回：Promise 对象

   KRTC.login().then(() => {
       console.log('login success');
   }).catch(err => {
       console.log(err);
   });

3. logout

   注销，必须在登录完成后调用。

   参数：null

   返回：Promise 对象

   KRTC.logout().then(() => {
       console.log('logout success');
   }).catch(err => {
       console.log(err);
   });

4. createRoom

   创建房间，必须在登录完成后调用。

   参数：

   名称	类型	说明
   roomType	Number	房间类型

roomType 参数说明：

取值：1-混流模式，2-非混模式

返回：Promise 对象
    resolve(roomId)
    reject(err)

```
KRTC.createRoom(1).then(roomId => {
    console.log('create room success', roomId);
}).catch(err => {
    console.log(err);
});
```

5. joinRoom

   加入房间

   参数：

   名称	类型	说明
   roomId	String	房间 ID

   返回：Promise 对象

   KRTC.joinRoom('123456789').then(() => {
       console.log('join room success');
   }).catch(err => {
       console.log(err);
   });

6. leaveRoom

   离开房间 ，必须在加入房间完成后调用。

   参数：null

   返回：Promise 对象

   KRTC.leaveRoom().then(() => {
       console.log('leave room success');
   }).catch(err => {
       console.log(err);
   });

7. destoryRoom

   销毁房间，须房间创建者调用。

   参数：

   名称	类型	说明
   roomId	String	房间 ID

   返回：Promise 对象

   KRTC.destoryRoom('123456789').then(() => {
       console.log('destory room success');
   }).catch(err => {
       console.log(err);
   });

8. createStream

   创建本地流，必须在加入房间完成后调用。

   参数：

   名称	类型	说明
   config	Object	流配置

   config 参数说明：

   名称	类型	说明
   audio	Boolean / Object	是否开启音频
   video	Boolean / Object	是否开启视频

   audio 参数说明：

   ```
   audio: {
       sampleRate: 44100, // 音频码率，默认为44100
   }
   ```

   video 参数说明：

   ```
   video: {
       width: 640, // 视频宽度，默认为640
       height: 480, // 视频高度，默认为480
       frameRate: 15, // 视频帧率，默认为15
       bitrate: 500, // 视频码率，默认为500
   }
   ```

返回：Promise 对象
    resolve(stream)
    reject(err)

```
KRTC.createStream().then(stream => {
    console.log('create stream success', stream);
}).catch(err => {
    console.log(err);
});
```

9. playStream

   播放本地流，需要传递本地流。

   参数：

   名称	类型	说明
   id	String	DOM的ID
   stream	Object	本地流

   返回：Promise 对象

   KRTC.playStream('local-video', stream).then(() => {
       console.log('play stream success');
   }).catch(err => {
       console.log(err);
   });

10. pushStream

    推送本地流，需要传递本地流。

    参数：null

    返回：Promise 对象

    KRTC.pushStream(stream).then(() => {
        console.log('push stream success');
    }).catch(err => {
        console.log(err);
    });

11. endPushStream

    结束推送本地流，需要传递本地流。

    参数：null

    返回：Promise 对象

    KRTC.endPushStream().then(() => {
        console.log('end push stream success');
    }).catch(err => {
        console.log(err);
    });

12. playRemoteStream

    播放远端流，需要传递远端流。

    参数：

    名称	类型	说明
    id	String	DOM的ID
    peerId	String	远端流的用户ID
    url	String	远端流地址

    返回：Promise 对象

    KRTC.playRemoteStream('remote-video', '123456789', 'http://
    .com/stream.m3u8').then(() => {
        console.log('play remote stream success');
    }).catch(err => {
        console.log(err);
    });

13 on

监听事件

参数：

event 参数：

返回：undefined

KRTC.on('joinRoom', (roomId) => {
    console.log('join room success', roomId);
}
KRTC.on('leaveRoom', () => {
    console.log('leave room success');
}
KRTC.on('destoryRoom', () => {
    console.log('destory room success');
}
KRTC.on('startPush', (roomId) => {
    console.log('start push success', roomId);
}
KRTC.on('endPush', (roomId) => {
    console.log('end push success', roomId);
}
KRTC.on('roomPeerReady', (roomId, peerId) => {
    console.log('room peer ready', roomId, peerId);
}

14. off

取消监听事件

参数：

返回：undefined

KRTC.off('joinRoom');
KRTC.off('leaveRoom');
KRTC.off('destoryRoom');
KRTC.off('startPush');
KRTC.off('endPush');
KRTC.off('roomPeerReady');