ionic2/3-热更新(cordova-hot-code-pu

前言

• code-push热更新请参照文章ionic2/3-热更新(code-push)
• code-push热更新和cordova-hot-code-push热更新的区别在于：
  1. code-push是将代码（文件）放到微软的服务器上，无需自己维护发布更新，使用命令即可完成发布；
  2. cordova-hot-code-push是将代码（文件）放到自己的服务器上，需要手动同步代码（文件）到自己的服务器，才能完成热更新

准备

• 在项目中安装cli
  npm install -g cordova-hot-code-push-cli
  图片.png
• 生成最新的www代码
  ionic build

ps: 如需要压缩，使用ionic build --prod

图片.png

• 执行命令生成配置文件
  cordova-hcp init

执行后会在项目根目录下生成一个cordova-hcp.json文件

图片.png
图片.png

{
  "name": "supowercar-passenger",
  "ios_identifier": "com.supowercar.passenger",
  "android_identifier": "com.supowercar.passenger",
  "update": "start",
  "content_url": "http://192.168.1.155:8080/www"
}

以上代码中：
content_url是更新内容的服务器地址；
update是更新类型，有三种取值，分别为start，now，resume

app每次启动会去服务器判断有无更新，有更新则下载更新内容
start:下载完更新，app下次启动的时候才会更新内容；
now:下载完更新，立即刷新页面应用更新（方便测试）；
resume:下载完更新，当app从后台切换到前台时应用更新（按手机home键进入后台）

• 使用命令cordova-hcp build或cordova-hcp server

会在www目录下生成两个文件：chcp.manifest和chcp.json
chcp.manifest描述了www目录中每个文件的hash值，热更新就是通过对比hash值是否相等，来确定需要更新哪个文件

图片.png
图片.png

• 把整个www目录拷贝tomcat服务器上
  图片.png
• 启动tomacat，访问http://192.168.1.155:8080/www/即可看到app界面
  图片.png

开始

• 给项目安装热更新插件
  ionic cordova plugin add cordova-hot-code-push-plugin

官网还推荐安装插件cordova plugin add cordova-hot-code-push-local-dev-addon（没必要安装）

图片.png

• 修改根目录下的config.xml文件配置config-file url

<chcp>
    <config-file url="http://192.168.1.155/www/chcp.json" />
</chcp>

图片.png

• 打包app

cordova platform rm android
cordova platform add android
cordova run android

发布热更新

• 修改页面代码

ps: 我修改的是src下的html文件，需要使用ionic serve或ionic build将最新代码编译到www目录下.=。
你的生产环境如果是压缩的，需要ionic build --prod

• 使用cordova-hcp build重新生成文件的hash
• 拷贝www目录到tomcat服务器上
• 重启app，发现页面已经改变

其他

• 每次修改了内容同步到服务器后，记得cordova-hcp build