ionic 热更新 cordova-hot-code-push

cordova-hot-code-push ,Cordova热代码推送插件提供了在应用程序中执行基于Web的内容的自动更新的功能。使用此插件能够更新存储在项目的www文件夹中的全部内容。

cordova-hot-code-push 插件的github url :https://github.com/nordnet/cordova-hot-code-push

更新流程

用户打开应用程序，Plugin get被初始化，并在后台线程中启动更新加载程序。更新加载器config-file从config.xml指定的网址载入并加载JSON。而后将release加载的配置的版本与当前安装的配置进行比较。若是他们不一样 - 咱们去下一步，程序经过content_url配置来加载清单文件。

 

1.建立一个ionic 项目

首先你先新建一个ionic项目，在这里我新建的是ionic版本是3.5

ionic start CordovaHotCodePush tabs

cd CordovaHotCodePush

npm install

ionic serve

2.添加插件

添加cordova-hot-code-push插件

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

添加用于本地开发的插件

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

安装Cordova Hot Code Push CLI客户端：

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

3.配置

找到项目目录下的config.xml文件，添加如下信息到config.xml文件中：

<chcp>
     <config-file url="http://192.168.1.203:8121/chcp.json" />

       <native-interface version="1" />

</chcp>

这里说明下关于config.xml文件里<chcp></chcp>应该怎么配置。

配置文件url：

<chcp>
     <config-file url="http://192.168.1.203:8121/chcp.json" />
</chcp>

URL指向的是我服务器更新文件的路径的chcp.json文件，在这里我是部署在iis 上，网站的物理路径我直接指向了项目的www文件夹。

在本地开发模式的状况下，若是config-file未定义，则会自动设置为本地服务器上的应用程序配置路径。

定义当前版本：

<chcp>
    <native-interface version="5" /> </chcp>

若是你应用程序的版本比服务器的版本还高，那么插件将不会从服务器加载新的更新，默认设置为1。

自动下载：

<chcp>
  <auto-download enabled="false" /> </chcp>

定义插件是否容许下载更新。最初更新提取是自动执行的，但您能够禁用它，并经过JavaScript模块手动执行。默认状况下，首选项设置为true。

 

自动安装：

<chcp>
  <auto-install enabled="false" /> </chcp>

定义插件是否容许安装更新。最初更新安装是自动执行的，但您能够禁用它，并经过JavaScript模块手动执行。默认状况下，首选项设置为true。

 

而后运行：

cordova-hcp sever

cordova-hcp build

如今 在项目文件下的www文件里面咱们能够看到两个新增的文件，chcp.json和chcp.manifest。

chcp.json就是我上面说的config.xml里 config-file url 指向的那个chcp.json文件。

 

接下来详解一下chcp.json里面有什么东西

当你运行cordov-hcp build 的时候 她里面的东西就会自动更新成这样

{
  "autogenerated": true,
  "release": "2017.07.08-16.34.13"
}

release是咱们生成的时间，除了这两个，还有其余的须要配置的。

content_url：服务器地址 咱们在config.xml配置的config-file 是这个http://192.168.1.203:8121/chcp.json，那么这里咱们就是这样的http://192.168.1.203:8121。

min_native_interface：版本设置。在config.xml咱们设置的native-interface version=5 那么咱们生成的就会是 "min_native_interface"：5.

update:能够设置的值有start：启动应用程序时安装更新；resume：从后台状态恢复应用程序时安装更新；now：一旦下载就安装更新；


如今咱们将chcp.json 文件修改为这样
resume：从后台状态恢复应用程序时安装更新；now：一旦下载就安装更新；


如今咱们将chcp.json 文件修改为这样

{
  "autogenerated": true,
  "release": "2017.07.08-16.56.31",
  "name": "hea",
  "content_url": "http://192.168.1.203:8121",
  "update": "start",
  "min_native_interface": 1
}

4.添加安卓平台

cordova platform add android

运行在真机上

cordova run android

5.测试是否成功

咱们修改项目的内容

而后 ionic serve 编译,跑在浏览器上咱们的页面内容确实改变了。咱们再运行cordova-hcp bulid,根据第三点配置，配置好chcp.json文件。

{
  "autogenerated": true,
  "release": "2017.07.08-17.22.34",
  "name": "hea",
  "content_url": "http://192.168.1.203:8121",
  "update": "start",
  "min_native_interface": 1
}

刚才不是 cordova run android 在真机上了嘛，如今咱们退出应用程序，再打开应用程序能够发现内容已经改变了。

本来项目内容：                                                                           退出应用再打开时候内容：

         

 

若是你对此文章有疑问的欢迎评论，此随笔乃本人原创仅做记录，如若转载请说明出处。

如果此文章对你有帮助，文章右下方点赞推荐。