东莞注塑切水口东莞网站建设,商标注册查询官网入口官网,品牌咨询,长春做网站的公司有哪些实现音视频通话(Web)网易云信音视频通话产品的基本功能包括高质量的实时音视频通话。当您成功初始化 SDK 之后#xff0c;您可以简单体验本产品的基本业务流程。本文档为您展示音视频通话提供的基本业务流程。前提条件请确认您已完成以下操作#xff1a;快速跑通Sample Code注…实现音视频通话(Web)网易云信音视频通话产品的基本功能包括高质量的实时音视频通话。当您成功初始化 SDK 之后您可以简单体验本产品的基本业务流程。本文档为您展示音视频通话提供的基本业务流程。前提条件请确认您已完成以下操作快速跑通Sample Code注意在运行示例项目之前请联系商务经理开通非安全模式。非安全模式建议只在集成开发阶段使用请在应用正式上线前改回安全模式。在SDK和示例代码下载页面或 Demo 体验页面下载需要体验的示例项目或 Demo 源码工程。在 /src/views/home/index.vue 文件中配置 App Key。data () {return {isSilence: false,isDesc: true,isStop: false,desc: 等待对方进入...,appkey: , //填入您的appkeytoken: ,client: null,localUid: Math.ceil(Math.random() * 1e5),localStream: null,remoteStream: null}},运行项目。该工程使用 vue(vue-cli 4.x) 技术栈请使用 node 开发环境 version 8。// Project setupnpm install// Compiles and hot-reloads for developmentnpm run dev// Compiles and minifies for productionnpm run build// Lints and fixes files**npm run lint实现音视频通话本节主要介绍如何使用 SDK 实现音视频通话。主要流程如下图所示WebRTC2 中有两个重要类Client代表一个本地客户端。Client 类的方法提供了音视频通话的主要功能例如加入房间、发布音视频流等。Stream代表本地和远端的音视频流。Stream 类的方法用于定义音视频流对象的行为例如流的播放控制、音视频的编码配置等。调用 Stream 方法时请注意区分本地流和远端流对象。1. 引用文件在项目相应的前端页面文件中对 NIM_Web_WebRTC2_vx.x.x.js 文件进行引用。import 方式引入import WebRTC2 from ../../NIM_Web_WebRTC2_vx.x.x.jsscript 标签引入2. 初始化执行 createClient 方法创建 client 实例。//示例//创建client实例rtc.client WebRTC2.createClient({appkey: xxx, //您的 appkeydebug: true, //是否开启调试日志});3. 设置本地视图初始化成功后可以设置设置本地视图预览本地图像。加入房间后可以执行 publish 方法发布自己的多媒体流至流媒体供其他用户订阅。//初始化本地流并且发布function initLocalStream(){//创建本端stream实例销毁前无需重复创建rtc.localStream WebRTC2.createStream({uid: uid, // 本端的uidaudio: true, // 是否从麦克风采集音频microphoneId: microphoneId, // 麦克风设备 deviceId通过 getMicrophones() 获取video: true, // 是否从摄像头采集视频cameraId: cameraId // 摄像头设备 deviceId通过 getCameras() 获取})//启动本地音视频流销毁前无需重复初始化rtc.localStream.init().then((){console.warn(音视频初始化完成播放本地视频)//用于播放视频的div元素let div document.getElementById(local-container)//开始播放本地视频流rtc.localStream.play(div)//设置播放的视频容器大小rtc.localStream.setLocalRenderMode({width: 180,height: 150,cut: true // 是否裁剪})// 将本地音视频流发布至云信服务器加入房间前不用执行此方法。rtc.client.publish(rtc.localStream).then((){console.warn(本地 publish 成功)})})}4. 加入房间加入房间前请确保已完成初始化相关事项。若您的业务中涉及呼叫邀请等机制可以使用信令。//加入频道rtc.client.join({channelName: 频道名称,uid: uid,token: }).then((obj) {console.info(加入频道成功...)//初始化本地流并且发布initLocalStream() //后面介绍说明})参数说明参数说明token安全认证签名(NERTC Token)。可设置为null。非安全模式下可设置为 null。安全性不高建议在产品正式上线前联系对应商务经理转为安全模式。已获取的NERTC Token。安全模式下必须设置为获取到的 Token 。若未传入正确的 Token 将无法进入房间。推荐使用安全模式。channelName房间名称设置相同房间名称的用户会进入同一个通话房间。注意您也可以在加入通道前通过创建房间接口创建房间。加入房间时若传入的 {channelName} 未事先创建则云信服务器内部将为其自动创建一个名为 {channelName} 的通话房间。uid用户的唯一标识 id房间内每个用户的 uid 必须是唯一的。5. 设置远端视图音视频通话过程中除了要显示本地的视频画面通常也要显示参与互动的其他连麦者/主播的远端视频画面。通过以下回调获取相关信息peer-online监听远端用户加入通话房间的事件并抛出对方的 uid。当本端加入房间后也会通过此回调抛出通话房间内已有的其他用户。stream-added监听远端用户发布视频流的事件回调中携带对方的 uid 与发布的视频分辨率。在监听到远端用户发布视频流后本方可以通过 subscribe 方法对其发起视频流的订阅来将对方的视频流渲染到视频画布上。// 示例//设置要订阅音频或者视频remoteStream.setSubscribeConfig({audio: true,video: true})// 发起订阅rtc.client.subscribe(remoteStream).then((){console.log(发起订阅对端成功)})订阅成功后可进一步在 stream-subscribed 回调中播放远端视频流。//播放订阅的对端的音视频流rtc.client.on(stream-subscribed, evt {console.warn(订阅别人的流成功的通知)var remoteStream evt.stream;let div document.getElementById(remote-container)//开始播放远端音视频流remoteStream.play(div).then((){console.log(播放对端的流成功)remoteStream.setRemoteRenderMode({width: 180,height: 150,cut: true})})})6. 退出通话房间通过 leave() 接口退出通话房间。//用户无需做一些清除动作sdk会自动做清除逻辑rtc.client.leave()7. 销毁实例当确定短期内不再使用音视频通话实例时可以释放对应的对象资源。//一般情况下无需使用rtc.client.destroy()本篇文档内容是否对您有帮助有帮助 我要吐槽如果遇到产品相关问题您可 提交工单 或 在线客服 寻求帮助。您的改进建议×问题类型内容错误内容没更新描述不清链接有误步骤不完整内容缺失(缺少代码/示例)其他更多建议请输入您的建议或问题(至少5个字符至多500个字符)联系方式标记内容同时提交标记内容提交此文档对你是否有帮助×有帮助 我要吐槽×反馈成功非常感谢您的反馈我们会继续努力做得更好。
