利用ionic实现IOS和Android端热更新简单搭建

1、热更新的好处？
通常ionic源码包括（html、javaScript css文件和其他资源）往常我们必须通过提交程序到应用市场、经过漫长的审核用户更新、每一个更改的小地方都需要从新打包编译。现在ionic通过使用cordova插件cordova-hot-code-push 实现ios与Android端代码功能、可不必要应用市场平台审核、便可以实现动态的app源码的目的。
2、热更新实现原理
这里写图片描述
3、基础实现方式
3.1、安装cordova-hot-code-push-cli
使用命令安装

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

主要是生成检测配置文件，通常在www目录下动态生成chcp.json和chcp.manifest生成两个文件、插件源码地址：https://github.com/nordnet/cordova-hot-code-push
3.2、创建项目
包含www目录的项目、已经有的项目无需创建
3.3、安装热更新插件
使用命令安装

ionic plugin add cordova-hot-code-push-plugin

ionic plugin add cordova-hot-code-push-local-dev-addon

4、打包封装
执行命令cordova-hcp build 或者cordova build
5、启动hcp server服务
从新打开一个终端窗口，cd到项目目录（包含www目录的父级项目目录）执行命令

cordova-hcp server

稍后会www目录下动态生成chcp.json和chcp.manifest生成两个文件
6、正常运行完成前4个步骤在config.xml动态加入如图所示的连接地址
这里写图片描述

图中链接地址https://1980480f.ngrok.io/chcp.json，修改为在第8步www目录里chcp.json文件可访问的地址：例如：http://kaibin.me/hotcode/chcp.json
7、运行代码或打包我们的App
8、修改我们想要更新的代码
然后修改 chcp.json 文件的 content_url ，此地址为我们项目放置的地址

{
  "autogenerated": true,
  "release": "2018.05.30-11.36.13",
  "content_url": "http://kaibin.me/hotcode",
  "update": "now"
}

9、将项目www目录代码上传到服务器可访问的目录里
例如在服务器根目录创建hotcode命名的目录将项目www里的文件上传上去
10、关闭我们的应用重新打开，看看代码是否更新成功
11、创建cordova-hcp模板
11.1、线上测试可卸载掉 cordova-hot-code-push-local-dev-addon防止每次自动更新新版本，可通过命令卸载：

cordova plugin remove cordova-hot-code-push-local-dev-addon

可以在 cordova 项目根目录下放一个 cordova-hcp.json，这是个模板文件
这样每次执行 cordova-hcp build就会利用这个模板生成新的 chcp.json，而不用手动更改 www/chcp.json了。
cordova-hcp.json内容如下：

{
  "autogenerated": true,
  "content_url": "http://kaibin.me/hotcode",
  "min_native_interface": 1, // app内核版本号
  "ios_identifier": "https://itunes.apple.com/cn/app/***", // iOS上线后的地址，用于内核版本更新后的确认跳转
  "update": "now"
}

12、Build options build设置，配置开发环境、测试环境与生产环境
在 /Cordova/Testproject/ 下创建 chcpbuild.options 文件，文件内容如下:

{
  "dev": {
    "config-file": "https://dev.kaibin.me/hotcode/www/chcp.json"
  },
  "production": {
    "config-file": "https://kaibin.me/hotcode/chcp.json"
  },
  "QA": {
    "config-file": "https://test.kaibin.me/hotcode/chcp.json"
  }
}

这样在build app的时候, 转为开发要用的服务器, 可执行:

ionic build -- chcp-dev

结果就是, 特定拍下的 config.xml 文件(比如, /Cordova/TestProject/platforms/android/res/xml/config.xml) 变成了这样:

<chcp>
  <config-file url="https://dev.kaibin.me/hotcode/chcp.json"/>
</chcp>

当我们需要上架app的时候 (Google Play, App Store) - 我们正常build

ionic build --release

这样 config.xml 不会改变

如果没有使用 chcpbuild.options 插件会使用 config.xml 里面默认的值。
文件必须位于 Cordova 项目根目录. 在这个文件里面，指定(JSON格式) 所有想改变 config.xml 文件的配置，源文件 config.xml (Cordova项目根目录) 不会发生变动, 改变的是特定平台下的 config.xml (在cordova build过程的 after_prepare 阶段)。

利用ionic实现IOS和Android端热更新简单搭建

猜你喜欢