@tanzerfe/meet-video NPM

音视频公共组件接入方法

MeetVideo实例参数说明

端类型：

all：所有
pc: 仅pc端
pc,app： pc和app端

参数	类型	必传	端类型	备注
appid	`string`	是	all	声网应用id
channel	`string`	是	all	固定字符'channelowner' 加当前用户id（uid）
userInfo	`{ uid, nickName }`	是	all	用户信息，h5端通过URL传uid、nickName参数
ivtURL	`string`	是(pc,app)	pc,app	邀请入会链接
authURL	`string`	是	all	授权地址（取token的服务）
deptURL	`string`	是	all	部门树接口地址 GET
expertURL	`string`	是	all	专家树接口地址 GET
smsSendURL	`string`	是(pc,app)	pc,app	短信发送接口地址
webui	`string`	是	all	pc电脑端 pm移动端
device	`string`	是	all	细分设备类型: 'pc'	'app'	'h5'	'electron'	'ipad'
bridge	`object`	是（app）	app	通信对象不传默认为 postMessage
ivtSponsorName	`string`	是	h5	发起邀请的人名称
ivtSponsorId	`string`	是	h5	发起邀请的人id
ivtChannel	`string`	是	h5	被邀请加入的频道号，为channel_owner时，可拉起指挥中心
ivtURLCreateTime	`number`	不用传	h5	邀请链接生成时间（对应URL参数为t）
smsIvtURLExpire	`number`	否	h5	短信邀请链接的有效时间，单位秒（默认30*60秒）
cityName	`string`	否	h5	城市名
headerTitleName	`string`	否	all	顶部标题 `V0.1.20+`支持
enableAgoraLog	`boolean`	否	all	声网日志开关(默认关)
debug	`any`	否	h5	eruda调试面板，URL参数传任意真值则开启调试
mountElementId	`string`	否	all	挂载元素id，默认挂载到body，`V0.1.8+`支持
liveH5s	`object`	否	all	零视配置(查看@tanzerfe/live-hub文档
liveSkyNet	`object`	否	all	天网配置(查看@tanzerfe/live-hub文档
externalLib	`object`	否	all	导入第三方库如 {flvjs, Hls, LiveH5s} `V0.1.20+`支持
screenShare	`boolean`	否	pc	是否开启屏幕共享功能 `V0.1.24+`支持
screenshot	`boolean`	否	pc	是否开启截屏功能 `V0.1.22+`支持
shareMeeting	`boolean`	否	pc	是否开启分享会议功能 `V0.1.24+`支持
shareMeetingLinkSysName	`string`	否	pc	分享会议链接系统名称 `V0.1.24+`支持

方法	参数	备注
toggleView(type: VIEW_TYPE)	VIEW_TYPE: 0隐藏 1正常大小 2悬浮窗	切换窗口模式
showShareView(data: IShareInfo)	参考 IShareInfo 类型定义，uid，url为必传, 支持html画面(在extData扩展字段传`{ urlType: 'html' }`，`V0.1.21+`支持)	显示共享视频流
destroy	无	销毁实例

接入示例

import MeetVideo from '@tanzerfe/meet-video';
import '@tanzerfe/meet-video/dist/theme/default.css'; // 导入样式

// pc端初始化
new MeetVideo({
  appid: '', // 声网应用id
  channel: 'channel_owner_' + uid, // 通过组合uid参数生成
  userInfo: { uid, nickName }, // 用户信息
  ivtURL: '', // 邀请入会链接
  authURL: '', // 授权地址（取token的服务）
  deptURL: '', // 部门树接口地址 GET
  expertURL: '', // 专家树接口地址 GET
  smsSendURL: '', // 短信发送接口地址
  webui: 'pc', // UI类型: pc端, pm移动端
  device: 'pc', // 设备类型: 'pc' | 'app' | 'h5' | 'electron' | 'ipad'
  enableAgoraLog: false, // 声网日志开关(默认关)
});


// app端初始化
new MeetVideo({
  appid: '', // 声网应用id
  channel: 'channel_owner_' + uid, // 通过组合uid参数生成
  userInfo: { uid, nickName }, // 用户信息
  ivtURL: '', // 邀请入会链接
  authURL: '', // 授权地址（取token的服务）
  deptURL: '', // 部门树接口地址 GET
  expertURL: '', // 专家树接口地址 GET
  smsSendURL: '', // 短信发送接口地址
  webui: 'pm', // UI类型: pc端, pm移动端
  device: 'app', // 设备类型: 'pc' | 'app' | 'h5' | 'electron' | 'ipad'
  bridge: {}, // 通信对象
  enableAgoraLog: false, // 声网日志开关(默认关)
});


// h5端取参数(h5通过URL方式获取，web端和app端通过系统内部获取)
const uid = parseUrl(window.location.href).uid;
const nickName = parseUrl(window.location.href).nickName;
const ivtChannel = parseUrl(window.location.href).ivtChannel;
const ivtSponsorName = parseUrl(window.location.href).ivtSponsorName;
const ivtSponsorId = parseUrl(window.location.href).ivtSponsorId;
const ivtURLCreateTime = +parseUrl(window.location.href).t;

// h5端初始化
// <link rel="stylesheet" href="./theme/default.css?v=0.1.11"> <!-- 引用样式 -->
new MeetVideo({
  appid: '', // 声网应用id
  channel: 'channel_owner_' + uid, // 通过参数生成
  userInfo: { uid, nickName }, // 用户信息
  ivtChannel, // 被邀请加入的频道号
  ivtSponsorName, // 发起邀请的人名称
  ivtSponsorId, // 发起邀请的人id
  ivtURLCreateTime, // 邀请链接生成时间（对应URL参数为t）
  ivtURL: '', // 邀请入会链接 (h5用)
  authURL: '', // 授权地址（取token的服务）
  deptURL: '', // 部门树接口地址 GET
  expertURL: '', // 专家树接口地址 GET
  smsSendURL: '', // 短信发送接口地址
  webui: 'pm', // UI类型: pc端, pm移动端
  device: 'h5', // 设备类型: 'pc' | 'app' | 'h5' | 'electron' | 'ipad'
  cityName: '',
  enableAgoraLog: false, // 声网日志开关(默认关)
});

视频对话接入

pc端构造短信链接：

配置固定参数 ivtVideoLink: 'https://xxx.com/agora-h5/xx-beta/?ivtChannel=channel_owner&ivtSponsorName=发起人&ivtSponsorId=指定remote用户id'
拼接动态参数 ${ivtVideoLink}&uid=${phone}&nickName=${encodeURI('用户号码' + phone)}&t=${new Date().getTime()} (phone为用户号码)

h5端配置链接有效期：