ionic2/3-热更新(cordova-hot-code-push)

前言

  • 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
    ionic2/3-热更新(cordova-hot-code-push)_第1张图片
    图片.png
  • 生成最新的www代码
    ionic build

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

ionic2/3-热更新(cordova-hot-code-push)_第2张图片
图片.png
  • 执行命令生成配置文件
    cordova-hcp init

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

ionic2/3-热更新(cordova-hot-code-push)_第3张图片
图片.png

ionic2/3-热更新(cordova-hot-code-push)_第4张图片
图片.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是更新类型,有三种取值,分别为startnowresume

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

  • 使用命令cordova-hcp buildcordova-hcp server

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

ionic2/3-热更新(cordova-hot-code-push)_第5张图片
图片.png

ionic2/3-热更新(cordova-hot-code-push)_第6张图片
图片.png

  • 把整个www目录拷贝tomcat服务器上
    ionic2/3-热更新(cordova-hot-code-push)_第7张图片
    图片.png
  • 启动tomacat,访问http://192.168.1.155:8080/www/即可看到app界面
    ionic2/3-热更新(cordova-hot-code-push)_第8张图片
    图片.png

开始

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

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

ionic2/3-热更新(cordova-hot-code-push)_第9张图片
图片.png
  • 修改根目录下的config.xml文件配置config-file url

    

ionic2/3-热更新(cordova-hot-code-push)_第10张图片
图片.png
  • 打包app
cordova platform rm android
cordova platform add android
cordova run android

发布热更新

  • 修改页面代码

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

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

其他

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

你可能感兴趣的:(ionic2/3-热更新(cordova-hot-code-push))