热更新:当用户初次打开app,它会将所有的web内容复制一份到外部存储。此后从外部存储加载web内容,而并不加载打包在app内部的web内容。app每次启动都会连接服务器检查更新并下载新的web内容。如果下载了更新,此次更新内容将会在下次app启动时生效。
安装cordova
需要安装cordova5.0+
cordova plugin add cordova-hot-code-push-plugin
此命令下会方便生成必需的app配置文件
启动本地服务器,监听开发模式下的web内容变更,并直接部署新版本。
Cordova项目快速向导
1、创建新的Cordova项目,并添加android和ios platform;
cordova create TestProject com.won.testproject TestProject
cordova platform add android
2、添加插件:
cordova plugin add cordova-hot-code-push-plugin
3、添加开发扩展
cordova plugin add cordova-hot-code-push-local-dev-addon
4、安装Cordova Hot Code Push命令行客户端
npm install -g cordova-hot-code-push-cli
5、启动本地服务器
cordova-hcp server
6、打开新的控制台,进入到项目根目录运行app
cordova run android
更新机制的流程图
1、用户打开你的app。
2、插件初始化,在后台进程启动升级加载器(update loader)。
3、Update loader从config.xml取config-file配置一个url,并从此url加载一段json配置,然后它把这段json配置中的release版本号和当前的app已经安装的进行比较。如果不同进行下一步。
4、update loader使用app配置(application config)中的content_url,去加载清单文件(manifest)。它会找出自上次升级以来,哪些文件需要更新。
5、update loader从content_url下载更新文件。
6、如果一切顺利,发出一个“升级文件已经准备好,可以安装了”的通知。
7、升级文件已安装,app重新进入更新过的页面。
web内容是如何存储和更新的
每一个Cordova项目下都有一个www目录,这里存放所有的web内容。当cordova build执行后,www的内容会拷贝到对应的platform的www目录下。于是这些文件被打包到了app,app里的文件是只读的,不可改变,所以在app第一次启动的时候,将内置的web内容(www目录)复制到外部存储。我们不想在拷贝过程中阻塞ui。我们还是会先加载app内置的index.html。但是下一次启动和更新,我们就从外部存储加载index.html。
注:如果app外壳需要增加新的Cordova插件或者原生功能,必须重新上架外壳App到应用商店。
app配置文件
1、chcp.json里面有个release设置,这个指明了web内容的版本。它由命令行客户端自动生成,格式是年月日
每次发布,插件在外部存储自动生成一个以这个release版本为名字的目录,然后把web内容全部放到这里面。release版本号成了url的一部分。
注:修改了一些文件,重新启动了app,但是看到的是旧的页面,原因是插件用的是旧版本的web内容(外部存储中)。若要清除缓存。
2、我们发布新版之后,插件需要下载新的web文件,发生情况如下
- 1、在外部存储创建一个以新的release版本号为名字的目录
- 2、在目录里面,又创建了一个update目录
- 3、所有根据chcp.manifest更新的文件,都被下载到了这个update目录内
- 4、新的chcp.manifest和chcp.json也被放到了update目录内
- 5、新的web内容已准备安装
安装更新
- 1、将使用的release版本目录内的内容拷贝到新的release版面目录下,新建的www目录下
- 2、从update目录下拷贝新的web内容和配置文件,到www目录。
- 3、移除update目录
- 4、加载新的release版本index.html
Cordova Hot Code Push 命令行客户端
- 生成chcp.json和chcp.manifest文件
- 运行本地服务,开发时可以检测更新,并发布新的release版本,使得可以在设备上实时更新web内容
- 部署你的web内容到外部服务器上
本地开发扩展
- 1、web项目做一些改动
- 2、执行cordova run 启动app
- 3、稍等一会查看运行结果
本地配置流程
- 1、添加cordova插件(Hot Code Push Local Development Add-on)
- 2、启动本地服务cordova-hcp server
- 3、在你的项目的config.xml文件中的<chcp />块下添加<local-development enabled='true' />
- 4、启动app
Cordova配置项
在根目录下的config.xml文件进行配置
<chcp>
<config-file url="https://e4c6b23c.ngrok.io/chcp.json" />
</chcp>
自动加载和安装
<chcp>
<auto-install enabled="false" />
<auto-download enabled="false" />
</chcp>
配置文件
chcp.json和chcp.manifest
Application config app配置
最新版本的release信息,放在www目录下,文件名为chcp.json,这个文件也被打包到外壳app内。
执行cordova-hcp命令,自动生成chcp.json和chcp.manifest文件
cordova-hcp init
执行此命令发布新的release版本
cordova-hcp build
注:cordova的热更新,在什么情况下,需要更新app外壳。
update
- start App启动时安装更新
- resume app从后台切换过来的时候安装更新
- now web内容下载完毕即安装更新
android_identifier(鉴定人)
apk报名,如果指定了,引导用户到Google Play Store的app页面
Content manifest内容清单
内容清单描述了web项目所有文件的状态
根据这个清单,插件才知道什么文件被移除了,什么文件更新或新增了。
- 更新从服务端下载的web内容文件
- 安装时删除服务端不存在(已移除)的文件
生成chcp.manifest文件的命令
cordova-hcp build
Build options build设置
如果想在使用build命令的时候改变插件的位置,那么需要使用chcpbuild.options文件。文件必须位于Cordova项目根目录
{
"dev": {
"config-file": "https://dev.company_server.com/mobile/www/chcp.json"
},
"production": {
"config-file": "https://company_server.com/mobile/www/chcp.json"
},
"QA": {
"config-file": "https://test.company_server.com/mobile/www/chcp.json"
}
}
build app的时候,转为开发要使用的服务器,可执行
cordova build -- chcp-dev
执行此命令后,cofig.xml文件中的chcp配置就会得到变动
当需要上架app的时候,我们build的命令
cordova build --release
热更新流程
1、app启动
2、从服务器请求chcp.json文件,覆盖本地的chcp.json文件
3、服务器返回的chcp.json文件与app里的chcp.json文件做对比,判断release版本
4、如果服务器chcp.json文件的release时间大于app里的chcp.json的release时间,就更新资源
5、发送请求,更新服务器的chcp.manifest文件
6、服务器返回chcp.manifest文件与app里的chcp.manifest文件内容对比
7、如果有不一样的hash值
8、对服务器请求新的资源
9、请求成功后资源覆盖本地资源