cordova打包app热更新问题

定义: 基于 cordova 框架能将web应用 (js, html, css, 图片等) 打包成 App。当 App 在终端上安装后,不需要重新下载app,实现内壳更新。

原理:1.在项目根目录的config.xml文件中添加指向服务器的地址

            2.在www目录中添加chcp.json配置文件,配置指向服务器,更新时间,更新方式

步骤:(进入项目目录)

1、在cordova项目下添加热更新插件  cordova-hot-code-push

cordova plugin add cordova-hot-code-push-plugin  命令

(安装插件后可以看到项目根目录增加了cordova-hcp.json。我的内容如下:)

           {
                            "name": "test",               // 可为空
                            "autogenerated": true,   //必须项,否则热更新无法使用(需手动添加)
                            "ios_identifier": "",          //应用在Apple Store id(可不填)
                            "android_identifier": "",   //应用在应用商店上的地址或app下载地址(可不填)
                            "update": "start",            //在应用启动时安装
                            "content_url": "http://192.168.0.114:8080/ptzy/www"    //www文件在服务器上的地址
                       }

update可选值:

  • start:应用启动,默认项(install update when application is launched)
  • resume:应用从后台恢复(install the update when application is resumed from background state)
  • now:下载更新后立即执行(install update as soon as it has been downloaded)

2、添加热更新工具  cordova-hot-code-push-cli

npm install -g cordova-hot-code-push-cli  命令

3、借助 cordova-hot-code-push-cli 工具在www目录下生成chcp.json和chcp.manifest文件:

执行 cordova-hcp init 命令

          Application config:chcp.json 包含发布相关信息:热更新代码版本号,应用 native side 版本号等等(描述了热更新代码的版本信息)

           Content manifest:chcp.manifest 包含项目热更新代码(静态)文件信息:文件名和文件哈希值(提供了热更新代码文件的变更信息)

4、config.xml 配置

在<widget>元素下添加如下:

 

  • auto-download:是否自动下载热更新代码,默认是 true
  • auto-install:是否自动安装热更新代码,默认是 true
  • native-interface:当前 native side 的版本号
  • config-file:配置文件 chcp.json 从服务器上加载的路径(必须的配置项)

5、cordova-hcp build

           执行该命令会在chcp.json文件中增加"release":"当前时间"字段。

(默认使用时间戳,格式为:yyyy.MM.dd-HH.mm.ss),插件将版本号进行字符串相等比较来判断是否存在新版本。

6、cordova build 打包安装app

7、测试更新

例:修改cordova项目下的html内容或js中alert("测试内容")后,执行步骤5命令,然后将项目下的www文件上传至content_url 配置的服务器文件路径下,重新打开app即可。

以下是检测文件修改,执行cordova-hcp server命令,如下:

当cordova中有文件修改时会输出文件信息,如下:

注:该方法为本人亲测实现,仅代表本人观点。如有讲述不清或其他问题,请留言,谢谢!

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章