Web

一、快速开始

集成指南

适用范围

本集成文档适用于Web ARRtcpKit SDK 3.0.0及以上版本。

兼容情况

  • Chrome、Firefox、safari 11(以上)等，具体使用webRTC检测工具

  • H5支持chrome内核。

准备环境

支持 Chrome、IE 10 +、Firefox、Safari 等主流浏览器环境

导入SDK

npm 市场

npm install ar-rtcp --save-dev

import ArRTCPKit from 'ar-rtcp';

  • 安装或更新至最新版本：

js 引用

开发指南

1. 初始化SDK

集成SDK后，还需对SDK在页面进行初始化操作。

1.1 导入头文件

1.2 实例化对象

1.3 监听回调

1.4 配置开发者信息

配置开发者信息，开发者信息可在anyRTC管理后台中获得，详见创建anyRTC账号。

2.设置本地显示窗口

设置本地显示窗口，参数constraints为音视频配置项，包含视频帧率、码率、相机类型等。

3.视频流操作

mediaType媒体类型：0 视音频，1音频 stream辅流视频 rtcpID系统分配的频道ID mediaRender视频对象

4.退出

离开房间。

二、API接口文档

ArRtcpKit 接口

1. 实例化对象

参数

参数名

类型

描述

Options

Object

实例配置

Options

参数名

类型

描述

videoProfile

String

视频分辨率，发布媒体流的类型为音视频时才成效

logLevel

String

打印日志级别： info、warning、error

userId

String

自定义用户ID

userData

String

自定义用户数据，推荐JSON字符串

autoBitrate

boolean

是否开启码流自适应

videoProfile

参数名

类型

描述

ARVideoProfile120P

String

160*120 65

ARVideoProfile180P

String

320*180 140

ARVideoProfile240P

String

320*240 200

ARVideoProfile360P

String

640*360 400

ARVideoProfile360P_1

String

640*360 512

ARVideoProfile480P

String

640*480 512

ARVideoProfile480P_1

String

640*480 768

ARVideoProfile720P

String

1280*720 1280

ARVideoProfile1080P

String

1920*1080 2048

2. 设置UserToken

示例

参数

参数名

类型

描述

userToken

String

anyRTC云平台的应用的appToken

说明

该方法为配置UserToken必须放在publish、subscribe之前，适用于企业级安全认证。

3. 配置开发者信息

示例

参数

参数名

类型

描述

appId

String

anyRTC云平台的应用id

appToken

String

anyRTC云平台的应用的Token

说明

该方法为配置开发者信息，上述参数均可在 www.anyrtc.io 应用管理中获得。

4. 配置私有云

示例

参数

参数名

类型

描述

address

String

私有云服务地址

说明

配置私有云信息，当使用私有云时才需要进行配置，默认无需配置。

5. 获取SDK版本号

示例

返回值

ARRtcpKit SDK版本号。

说明

获取当前SDK版本。

ArRtcpKit 接口类

1. 获取媒体设备

示例

参数

参数名

类型

描述

deviceType

string

媒体设备类型videoinput、audioinput、audiooutput，分别是摄像头、麦克风、扬声器

Return

Promise对象

Promise.then 返回的参数data对象，包含所查询的设备列表，如果deviceType为空则返回videoinput、videooutput、audioinput三个类型的设备列表

说明

获取设备列表，根据设备列表的id可以切换指定摄像头以及指定扬声器作为音频输出设备。

2. 预览本地音视频

示例

参数

参数名

类型

描述

constraints

Object

音视频配置，可以不填写默认为开启

constraints

参数名

类型

描述

video

Object

视频配置；

audio

Object

音频配置；

video

类型

描述

enable

Boolean

true为采集摄像头， false;

devideId

String

devideId: 设备ID，可通过getDevices方法获取

audio

类型

描述

enable

Boolean

true为采集麦克风， false;

devideId

String

devideId: 设备ID，可通过getDevices方法获取

Return

Promise对象

Promise.then 返回的参数data

data

描述

mediaStream

MediaStream

mediaRender

HTMLDivElement

说明

预览本地音视频，如果video.enable为true时，表示允许采集摄像头；video.deviceId表示采集指定摄像头的媒体流。

3. 切换设备

示例

参数

参数名

类型

描述

constraints

Object

音视频配置（非必填项）

constraints

参数名

类型

描述

video

Object

视频配置；

audio

Object

音频配置；

video

类型

描述

enable

Boolean

true为采集摄像头， false;

devideId

String

devideId: 设备ID，可通过getDevices方法获取

audio

类型

描述

enable

Boolean

true为采集麦克风， false;

devideId

String

devideId: 设备ID，可通过getDevices方法获取

Return

Promise对象

Promise.then 返回的参数data

data

描述

mediaStream

MediaStream

mediaRender

HTMLDivElement

说明

切换设备获取新的媒体流，将新的mediaRender展示到页面。

4. 设置本地音频是否传输

示例

参数

参数名

类型

描述

enable

Boolean

true传输，false不传输，默认为true

说明

该方法需要在setLocalVideoCapturer回调成功之后才能调用。

5. 设置本地视频是否传输

示例

参数

参数名

类型

描述

enable

Boolean

true传输，false不传输，默认为true

说明

该方法需要在setLocalVideoCapturer回调成功之后才能调用。

6. 获取本地视频传输是否打开

示例

说明

获取本地视频是否传输。

7. 获取本地音频传输是否打开

示例

说明

获取本地音频是否传输。

8. 发布媒体

示例

参数

参数名

类型

描述

mediaType

Number

媒体类型：0 视音频，1音频

roomId

string

房间ID，用于标识

说明

如果发布成功，回调中会分配一个频道Id，用户订阅该频道即可观看发布者图像

9. 取消发布媒体

示例

说明

取消发布媒体。

10. 发布辅流

示例

参数

参数名

类型

描述

scrnStream

String

需要发布的辅流（如：屏幕共享的视频流）

说明

发布辅流（屏幕共享流），发布共享流之前，需要获取到屏幕共享流，具体使用请查看ar-share-screen。

11. 取消发布辅流

示例

说明

取消发布辅流。

12. 媒体订阅

示例

参数

参数名

类型

描述

rtcpId

String

系统分配的频道ID

说明

媒体订阅。

13. 取消媒体订阅

示例

参数

参数名

类型

描述

rtcpId

String

系统分配的频道ID

说明

取消媒体订阅。

14. 监听某个房间的媒体流变化 NEW

示例

参数

参数名

类型

描述

roomId

String

媒体流发布书，指定的roomId

说明

监听某个房间的媒体流的发布与取消发布。

15. 取消监听某个房间的媒体流变化 NEW

示例

参数

参数名

类型

描述

roomId

String

媒体流发布书，指定的roomId

说明

取消监听某个房间的媒体流的发布与取消发布。

16. 结束直播

示例

说明

结束直播。

ARRtcpKit 回调

监听回调请在初始化之后监听，如果遇到回调多次的情况可能是监听多次回调引发的BUG。

1. 远程屏幕共享媒体流已订阅

示例

参数

参数名

类型

描述

pubId

String

RTC服务生成媒体流的唯一标识ID

说明

已订阅远程的屏幕共享媒体流，创建该媒体流的视图窗口，等待接收媒体流并展示。

2. 远程屏幕共享媒体流被移除

示例

参数

参数名

类型

描述

pubId

String

RTC服务生成媒体流的唯一标识ID

说明

远程的屏幕共享媒体流被移除，取消订阅并移除该媒体流的视图窗口。

3. 远程媒体流已订阅

示例

参数

参数名

类型

描述

pubId

String

RTC服务生成媒体流的唯一标识ID

说明

已订阅远程媒体流，创建该媒体流的视图窗口，等待接收媒体流并展示。

4. 远程媒体流被移除

示例

参数

参数名

类型

描述

pubId

String

RTC服务生成媒体流的唯一标识ID

说明

远程媒体流被移除，取消订阅并移除该媒体流的视图窗口。

5. 订阅媒体流音量大小变化

示例

参数

参数名

类型

描述

isRemote

Boolean

是否是远程用户

pubId

String

RTC服务生成媒体流的唯一标识ID

audioLevel

Number

音量范围为 0 到 100 之间的整数。通常在列表中音量大于 5 的用户为持续说话的人

说明

提示房间内谁在说话以及说话者的音量。每30毫秒回调一次。

6. 订阅媒体流网络变化

示例

参数

参数名

类型

描述

isRemote

Boolean

是否是远程用户

pubId

String

RTC服务生成媒体流的唯一标识ID

videoBytes

Number

视频码率

ARNetQuality

String

网络状况，根据丢包率严重分为5个等级，ARNetQualityExcellent(优)、ARNetQualityGood（良好）、ARNetQualityAccepted（一般）、ARNetQualityBad（差）、ARNetQualityVBad(极差)

说明

网络状态每一秒回调一次。

7. 加入频道成功

示例

8. 加入频道失败

示例

参数

参数名

类型

描述

code

Number

错误码，详情查看错误码

11. 发布媒体流成功

示例

参数

参数名

类型

描述

pubId

String

RTC服务生成媒体流的唯一标识ID

roomId

String

自定义频道ID,可通过listen方法，监听房间内所有的（实时）视频流变化。

说明

发布媒体流成功，返回roomId和pubId。

12. 发布媒体流失败

示例

发布媒体流失败。

13. 辅流发布成功

示例

参数

参数名

类型

描述

pubId

String

RTC服务生成媒体流的唯一标识ID

说明

辅流发布成功，获得媒体流标识Id。

14. 服务器断开连接

示例

说明

服务器断开连接。

三、更新日志

Version 3.0.9 （2019-09-11）

  • stream-published添加roomId回调参数

  • 更新文档

Version 3.0.7 （2019-08-13）

  • publish添加参数roomId

  • 添加方法listen和unListen

Version 3.0.5 （2019-06-21）

  • 优化

Version 3.0.4 （2019-05-27）

  • 更新文档，文档添加getDevices和switchDevice的介绍

  • 修复远程图像显示不全的问题

Version 3.0.0 （2019-01-24）

  • SDK版本升级3.0，API接口变更，更加简洁规范

PreviousiOSNext错误码

Last updated

Was this helpful?