草庐IT

记录--uni-app中安卓包检查更新、新版本下载、下载进度条显示功能实现

林恒 2023-03-28 原文

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助

需求描述

如果想要做一个app的话,可以有很多种选择方案,uni-app是其中的一个性价比高一些(坑多一些)的方案。本文记录一下,uni-app安卓包以后,需要检查并下载更新,且显示进度条的功能。

代码在自己公司项目中应用,大家可放心使用。

需求:

  • 检查版本是否是最新版
  • 若不是最新版就下载远端服务器的最新的apk包
  • 下载中需要显示下载了多少了,当下载到100%的时候,自动安装接口

思路分析

比如我们有一个设置页面,在设置页面中可以去进行版本更新。

1. 检查是不是最新版

当每次进入设置页面的时候,在onShow钩子中向后端发请求,获取最新版本的信息,并与当前的版本信息做对比。

比如后端提供的有这样一个:获取最新版本信息 的接口

// 接口请求,返回数据如下:
{
    "code": 1,
    "success": true,
    "data": {
        "id": 123456, // 存在数据库的id
        "applyName": "拼夕夕", // 版本名称
        "applyVersion": "1.2.3", // 版本号
        "versionDescribe": "此版本新增,是兄弟就帮忙砍一刀功能", // 版本描述
        "fileSize":11566511, // 文件的总大小,计算下载进度百分比需要使用
        "filePath": "http://ashuai.work:10000/appSrc/pdd.apk", // 版本的url路径,正常在浏览器地址栏中输入即直接下载了
        ... // 等等
    },
    "msg": "操作成功"
}

我们首先拿到后端返回的这个applyVersion字段的值"1.2.3"去和当下的版本值对比。如果远端的最新版的版本号高于当下的版本号,就说明要更新了。否则当下的就是最新版,就不用更新。

那问题又来了,如何能拿到当下的版本呢?没关系,官方提供的有api,可以直接获取的,代码如下:

plus.runtime.getProperty(plus.runtime.appid, (info) => {
        this.currentVersion = info.version; // 将当下版本存到currentVersion字段中去
})

注意这个获取版本号的操作是异步的哦,异步,异步。

然后将版本号字符串"a.b.c"转换成数字进行对比即可。

方式有很多种,比如:a*100000 + b*1000 + c*1

// 当然这里需要
if(this.applyVersionVal > this.currentVersionVal){
    // 需要更新
    this.AndroidUpdate()
}else {
    // 当前已是最新版本
    uni.showToast({
        title: '当前已是最新版本',
        duration: 2000,
        icon:'none'
    });
    return
}

2. 更新下载服务器远端的apk文件&进度条显示

调用安卓的方法,创建一个下载任务,能拿到某一时刻下载的文件的大小,对比总大小即可得到下载进度百分比

AndroidCheckUpdate() {
    const _this = this
    uni.showModal({
            title: "版本更新",
            content: 'APP有新版本发布,点击 立即更新 进行最新版本下载。',
            confirmText: '立即更新',
            cancelText: '稍后进行',
            success: function(res) {
                    if (res.confirm) {
                            _this.show = true // show变量控制一个下载进度弹框(这个UI样式自己写即可)
                            // 创建一个下载任务,并根据后端返回的apk静态资源地址filePath进行下载
                            var dtask = plus.downloader.createDownload(_this.filePath, {}, function(d, status) {
                                    // 下载完成  
                                    if (status == 200) {
                                            _this.show = false // 下载完成再把下载进度弹框关闭即可
                                            plus.runtime.install(plus.io.convertLocalFileSystemURL(d
                                                    .filename), {}, {}, function(error) {
                                                    uni.showToast({
                                                            title: '安装失败',
                                                            duration: 1500
                                                    });
                                            })
                                    } else {
                                            uni.showToast({
                                                    title: '更新失败',
                                                    duration: 1500
                                            });
                                    }
                            });
                            dtask.start(); // 下载任务开始下载
                            // 关于进度的获取是使用定时器不断获取已经下载的文件的大小,再对比总大小即可
                            let timer = setInterval(() => {
                                    let percent = (dtask.downloadedSize / this.fileSize).toFixed(2) // fileSize文件总大小,后端返回的
                                    _this.percentVal = Math.floor(percent * 100) // 转成整数展示
                                    if (percent >= 1) { // 注意百分比,及时清除定时器即可
                                            clearInterval(timer)
                                    }
                            }, 18)
                    } else if (res.cancel) {
                            console.log('稍后更新');
                    }
            }
    });
}

进度条使用的是u-popup组件,如下:

<u-popup :round="10" :show="show" mode="center">
        <view class="progressBox">
                <u-loading-icon size="36"></u-loading-icon>
                <text class="words">下载中 请勿退出 {{percentVal}}%</text>
        </view>
</u-popup>

注意,下载这一块是要在手机模拟器上,才能看到效果哦。笔者工作中使用的是逍遥模拟器,挺好。

因为plus变量在浏览器中是没有的

版本号

效果图

下载完毕以后,安卓自动安装

为了方便大家去验证,笔者也提供了一个apk静态资源包filePath: http://ashuai.work:10000/appSrc/pdd.apk ,在地址栏输入就可以访问了。

静态资源apk接口

express同级目录下,新建文件夹app存放一下apk文件

// 先查询有没有这个app,有的话返回这个静态app资源url地址
route.get('/findAppUrl', (req, res) => {
  res.header('Access-Control-Allow-Origin', '*');
  let appName = (req.query.appName ? req.query.appName : 'pdd') + '.apk'
  let files = fs.readdirSync('./app')
  if (files.includes(appName)) { // 库存有
    res.send({
      code: '00000000',
      url: "http://ashuai.work:10000/appSrc/" + appName
    })
  } else { // 库存没有
    res.send({
      code: '00000000',
      url: ""
    })
  }
})
// 当访问app资源时,就把对应的资源以流的形式返回去
route.get('/appSrc/:fileName', (req, res) => {
  res.header('Access-Control-Allow-Origin', '*');
  let fileName = req.params.fileName // wms2month.apk

  try {
    // 存储一份app的路径
    let appUrl = './app/' + fileName
    let stat = fs.statSync(appUrl)

    res.writeHead(200, {
      'Content-Type': 'application/vnd.android.package-archive', // 安卓
      'Content-Length': stat.size,
    })
    //创建可读流
    let readStream = fs.createReadStream(appUrl)
    // 将读取的结果以管道pipe流的方式返回
    readStream.pipe(res);
  } catch (error) {
    res.send('暂无此app文件哦')
  }

})

至于强制更新的话,就做一个判断即可,当前版本不是服务器远端的最新版本的话,就不让往下走,不让登录即可

本文转载于:

https://juejin.cn/post/7197401681129914405

如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。

 

有关记录--uni-app中安卓包检查更新、新版本下载、下载进度条显示功能实现的更多相关文章

  1. ruby - 如何使用 Ruby aws/s3 Gem 生成安全 URL 以从 s3 下载文件 - 2

    我正在编写一个小脚本来定位aws存储桶中的特定文件,并创建一个临时验证的url以发送给同事。(理想情况下,这将创建类似于在控制台上右键单击存储桶中的文件并复制链接地址的结果)。我研究过回形针,它似乎不符合这个标准,但我可能只是不知道它的全部功能。我尝试了以下方法:defauthenticated_url(file_name,bucket)AWS::S3::S3Object.url_for(file_name,bucket,:secure=>true,:expires=>20*60)end产生这种类型的结果:...-1.amazonaws.com/file_path/file.zip.A

  2. ruby-on-rails - 项目升级后 Pow 不会更改 ruby​​ 版本 - 2

    我在我的Rails项目中使用Pow和powifygem。现在我尝试升级我的ruby​​版本(从1.9.3到2.0.0,我使用RVM)当我切换ruby​​版本、安装所有gem依赖项时,我通过运行railss并访问localhost:3000确保该应用程序正常运行以前,我通过使用pow访问http://my_app.dev来浏览我的应用程序。升级后,由于错误Bundler::RubyVersionMismatch:YourRubyversionis1.9.3,butyourGemfilespecified2.0.0,此url不起作用我尝试过的:重新创建pow应用程序重启pow服务器更新战俘

  3. ruby - Sinatra:运行 rspec 测试时记录噪音 - 2

    Sinatra新手;我正在运行一些rspec测试,但在日志中收到了一堆不需要的噪音。如何消除日志中过多的噪音?我仔细检查了环境是否设置为:test,这意味着记录器级别应设置为WARN而不是DEBUG。spec_helper:require"./app"require"sinatra"require"rspec"require"rack/test"require"database_cleaner"require"factory_girl"set:environment,:testFactoryGirl.definition_file_paths=%w{./factories./test/

  4. ruby-on-rails - 在 ruby​​ .gemspec 文件中,如何指定依赖项的多个版本? - 2

    我正在尝试修改当前依赖于定义为activeresource的gem:s.add_dependency"activeresource","~>3.0"为了让gem与Rails4一起工作,我需要扩展依赖关系以与activeresource的版本3或4一起工作。我不想简单地添加以下内容,因为它可能会在以后引起问题:s.add_dependency"activeresource",">=3.0"有没有办法指定可接受版本的列表?~>3.0还是~>4.0? 最佳答案 根据thedocumentation,如果你想要3到4之间的所有版本,你可以这

  5. ruby - RuntimeError(自动加载常量 Apps 多线程时检测到循环依赖 - 2

    我收到这个错误:RuntimeError(自动加载常量Apps时检测到循环依赖当我使用多线程时。下面是我的代码。为什么会这样?我尝试多线程的原因是因为我正在编写一个HTML抓取应用程序。对Nokogiri::HTML(open())的调用是一个同步阻塞调用,需要1秒才能返回,我有100,000多个页面要访问,所以我试图运行多个线程来解决这个问题。有更好的方法吗?classToolsController0)app.website=array.join(',')putsapp.websiteelseapp.website="NONE"endapp.saveapps=Apps.order("

  6. ruby-on-rails - 每次我尝试部署时,我都会得到 - (gcloud.preview.app.deploy) 错误响应 : [4] DEADLINE_EXCEEDED - 2

    我是Google云的新手,我正在尝试对其进行首次部署。我的第一个部署是RubyonRails项目。我基本上是在关注thisguideinthegoogleclouddocumentation.唯一的区别是我使用的是我自己的项目,而不是他们提供的“helloworld”项目。这是我的app.yaml文件runtime:customvm:trueentrypoint:bundleexecrackup-p8080-Eproductionconfig.ruresources:cpu:0.5memory_gb:1.3disk_size_gb:10当我转到我的项目目录并运行gcloudprevie

  7. ruby - 安装 Ruby 时遇到问题(无法下载资源 "readline--patch") - 2

    当我尝试安装Ruby时遇到此错误。我试过查看this和this但无济于事➜~brewinstallrubyWarning:YouareusingOSX10.12.Wedonotprovidesupportforthispre-releaseversion.Youmayencounterbuildfailuresorotherbreakages.Pleasecreatepull-requestsinsteadoffilingissues.==>Installingdependenciesforruby:readline,libyaml,makedepend==>Installingrub

  8. ruby-on-rails - Rails 5 Active Record 记录无效错误 - 2

    我有两个Rails模型,即Invoice和Invoice_details。一个Invoice_details属于Invoice,一个Invoice有多个Invoice_details。我无法使用accepts_nested_attributes_forinInvoice通过Invoice模型保存Invoice_details。我收到以下错误:(0.2ms)BEGIN(0.2ms)ROLLBACKCompleted422UnprocessableEntityin25ms(ActiveRecord:4.0ms)ActiveRecord::RecordInvalid(Validationfa

  9. ruby-on-rails - 如果我将 ruby​​ 版本 2.5.1 与 rails 版本 2.3.18 一起使用会怎样? - 2

    如果我使用ruby​​版本2.5.1和Rails版本2.3.18会怎样?我有基于rails2.3.18和ruby​​1.9.2p320构建的rails应用程序,我只想升级ruby的版本,而不是rails,这可能吗?我必须面对哪些挑战? 最佳答案 GitHub维护apublicfork它有针对旧Rails版本的分支,有各种变化,它们一直在运行。有一段时间,他们在较新的Ruby版本上运行较旧的Rails版本,而不是最初支持的版本,因此您可能会发现一些关于需要向后移植的有用提示。不过,他们现在已经有几年没有使用2.3了,所以充其量只能让更

  10. ruby-on-rails - 获取 inf-ruby 以使用 ruby​​ 版本管理器 (rvm) - 2

    我安装了ruby​​版本管理器,并将RVM安装的ruby​​实现设置为默认值,这样'哪个ruby'显示'~/.rvm/ruby-1.8.6-p383/bin/ruby'但是当我在emacs中打开inf-ruby缓冲区时,它使用安装在/usr/bin中的ruby​​。有没有办法让emacs像shell一样尊重ruby​​的路径?谢谢! 最佳答案 我创建了一个emacs扩展来将rvm集成到emacs中。如果您有兴趣,可以在这里获取:http://github.com/senny/rvm.el

随机推荐