ZEGO Express UniApp SDK 来了！

摘要：一套代码，应用多个平台，满足企业快速孵化热点产品的需求。

文｜RTC SDK 开发团队

对于很多中小型企业或者开拓型项目来说，在产品开发设计初期首要满足快速开发、快速迭代、完善业务逻辑的需求。而传统的原生App开发相对来说迭代速度慢、人员配比高、资金耗费大，因此一款简单、易上手、跨端表现优秀的框架就变得很有必要。

uni-app 是 DCloud 官方推出的一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到 iOS、Android、Web、以及各种小程序、快应用等多个平台，非常满足企业快速孵化热点产品的需求。

在此之前，即构推出 uni-app 平台的 Express 原生插件，支持 iOS 和 Android，用以满足客户的需求，但因为 JavaScript 接口的弱类型性质本身对客户使用没那么友好，增加了出错的机会，因此我们进行了优化，对接口进行全面的 TypeScript 重构，推出了 1.0.0 正式版，有完备的类型约束，支持 Promise，使接口更加清晰易用。

主要包含的功能模块：

基础的实时音视频功能
常用视频配置
房间实时消息
推拉流信息监测
编解码与分层编码
媒体播放器
流量控制等进阶功能

接下来，就带大家一起看下如何使用吧：

准备工作

ZEGO 开发者账户（通过 ZEGO 官网注册）
HBuilderX 3.0.5 及以上
iOS 9.0 及以上
Android 4.1 及以上
iOS/Android 真机(或支持音视频的模拟器)

快速接入

申请 ZEGO AppID

创建 uni-app 项目

使用 uni-app 官方IDE HBuilder，创建 uni-app 类型项目。

获取「ZegoExpressEngine」uniapp SDK

在uniapp插件市场或 ZEGO 官网获取插件，并将插件引入工程

下载「js封装层」代码，并引入工程

ZEGO 提供 uni-app js封装层接口，统一iOS、Android两端原生SDK接口，免去了在原生与前端之间来回跳转，开发者只需要有 js 技术栈，即可开发各平台音视频应用，给中小企业快速低成本接入。

下载地址

http://storage.zego.im/express/video/uniapp/zego-express-video-uniapp.zip

将以上「js封装层」引入到uniapp项目

基础推拉流功能实现

初始化引擎

import ZegoExpressEngine from 'zego-express-video-uniapp/lib/ZegoExpressEngine';import {    ZegoScenario} from 'zego-express-video-uniapp/lib/impl/ZegoExpressDefines'ZegoExpressEngine.createEngine(AppID, AppSign, false, ZegoScenario.General);

登入房间

ZegoExpressEngine.instance().loginRoom(t"room1", { userID: "user_id", userName: "user_name" });

开启音视频通话

在成功登入房间后，可调用startPreview 开启音视频：

<template>  <zego-local-view></zego-local-view></template>······// 需要在登入房间之后才能开启音视频通话ZegoExpressEngine.instance().startPreview();

将本地视频画面推向云服务

// 推入的streamID由用户设置let publishStreamID = 'Publish-Stream-1';ZegoExpressEngine.instance().startPublishingStream(publishStreamID);

拉取其他用户音视频

登入房间后主动监听 roomStreamUpdate，在收到其他用户推出的音视频流，即可拉取：

<template>  <zego-remote-view :streamID="playStreamID" ></zego-remote-view></template>······// 监听 roomStreamUpdateZegoExpressEngine.instance().on('roomStreamUpdate', (roomID, updateType, streamList) => {    this.playStreamID = streamList[0].streamID;});······// 拉取StreamID的音视频ZegoExpressEngine.instance().startPlayingStream(this.playStreamID);

退出房间

// 退出房间ZegoExpressEngine.instance().logoutRoom('room1');

销毁引擎

// 退出房间ZegoExpressEngine.destroyEngine();

注意事项

开启音视频通话需要在uniapp工程中的manifest.json申请麦克风和相机权限配置。

使用视频功能时，页面必须使用.nvue文件构建，因为uniapp的.vue页面在原生端（iOS、android）是用 webview 构建的，不能支持component类型的插件

详情可参考

https://nativesupport.dcloud.net.cn/NativePlugin/course/ios

结语

通过以上方式，就可以灵活使用ZEGO Express SDK了，进而让你的 uni-app 具备出色的基础音视频能力。

更多进阶功能请参考 ZEGO 官方文档和示例源码（https://doc-zh.zego.im/article/7775）。

465600ZEGO Express UniApp SDK 来了！