如何使用插件?

Viewed 32

如何在uniapp中使用更新插件,实现App更新功能?

1 Answers

一、后台管理添加应用

1.前往插件后台

点击 https://apps.seepine.com/ ,扫码登录即可。

2.创建应用

点击【新增应用】按钮,按需填写内容即可

3.版本管理

点击应用右上角【版本管理】,进入版本管理页面

4.添加默认版本

例如当前你应用的正式版为 1.0.0,则添加一个 1.0.0 的版本,

  • 版本号:需要注意版本号一定要和你uniapp代码的版本一致,若你的版本为 1.0 则此处也要填写 1.0
  • 其余信息:默认版本其余信息可随意填写没关系

5.设置正式版

点击版本旁边的图标,将 1.0.0 设置为正式版

二、代码集成

1.获取应用id

在应用列表复制应用id,此id为插件的appId,与uniapp的appId不是一个概念

2.引入组件,修改id值

记得把id 3729xxxxx9909 替换为你自己的appId

<wrap-version-update id="3729xxxxx9909"></wrap-version-update>

// 注意1. vue3需要手动引入
// import WrapVersionUpdate from '@/uni_modules/wrap-version-update/components/wrap-version-update/wrap-version-update.nvue'

// 注意2. 非setup模式还需要在组件中注册
// export default{
//    components:{ WrapVersionUpdate },  // 需要加到这里
//    data() {
//      return {}
//    }
//    ...
// }

3.监听事件

当需要更新会自动弹窗,当无需更新会触发finish事件,此时可表示应用为最新版,可由此事件继续应用的相关业务逻辑。

  • @check (info):无论是否需要更新都会触发事件,传入版本参数
  • @finish (info): 当无需更新会触发事件,传入版本参数
  • @error (err): 当检查更新失败会触发事件,传入错误信息,若你的APP对更新没有那么严格,建议失败时也进入你的APP,以免例如接口服务挂了或网络延迟,导致检测更新失败用户无法使用APP
<wrap-version-update id="3729xxxxx9909" @finish="handleFinish"></wrap-version-update>
<setup>
const handleFinish = ()=>{
  // 无需更新,跳转到首页或登录页之类
  uni.redirect({ url: '/pages/home' })
}
</setup>

4. 更多

更多参数可查看插件详细参数文档:
https://ext.dcloud.net.cn/plugin?id=5141

三、新版本发布

1. 修改代码版本号

请注意两个版本名称要和后台的版本对应,且一定都要比原来的大,例如此处都是 1.0.1101

注意尽量不要跨位例如 1.10.0 / 1100,否则下个版本 2.0.0 你可能会填成 200,导致值200没有比1100大,所以尽量都个位数就好比如 1.9.9199
或者一开始你就使用2位数组和,例如版本名称 1.0.1 版本,你版本号为 01.00.01,即 10001

2. 打包

分别使用云打包为 apk、本地打包为wgt

3. 上传包转为网络地址

将 apk 和 wgt 上传到 unicloud 文件存储,或者交给你们后端有自己的文件服务器,转化成可访问的网络地址,例如下方

  • http://cdn.example.com/wrap-update-version-1.0.1.apk
  • http://cdn.example.com/wrap-update-version-1.0.1.wgt

最好每个版本文件命名有规律,每次发版本不要覆盖之前版本文件,方便回滚旧版本

4. 发布新版本

按需填写即可,再次提醒,此处版本一定要和uniapp代码中的版本名称一致

5. 设置为正式版

一样点击版本旁边图标,设置为正式版,当使用 1.0.0 的用户打开app时,就能看到弹窗提示更新了