ionic cordova 热更新(引用自www.zyyapp.com/post/116.html)
上篇文章cordova 把html打包成安卓应用 http://www.zyyapp.com/post/115.html
cordova 热更新是一个大坑,我看了一天一夜才明白。网上的教程都没说到重点,他们只说了在本地调试,没说发布到自己的服务器,只有一篇说了但是也不详细。
下边就是没有坑的教程,包你顺溜的走完流程。
打开命令提示符 进入工程目录,如果你只能在node.js command prompt 中运行cordova命令,那是因为你没有在系统变量path中添加node.js的路径。
添加后即可在命令提示符中运行cordova命令。
2.进入工程目录
3.添加热更新插件
cordova plugin add cordova-hot-code-push-plugin
或者
ionic plugin add cordova-hot-code-push-plugin
(其他教程说要安装cordova-hot-code-push-local-dev-addon,其实不用这个,他只是帮助你调试用的。)
安装热更新命令工具。它安装起来比较慢你需要等一下
npm install -g cordova-hot-code-push-cli
(如果你安装了taobao npm 可以输入 cnpm install -g cordova-hot-code-push-cli ,taobao npm安装教程 http://www.zyyapp.com/post/114.html)
4.这里讲一下原理,不想看的话直接跳到第5步,这步没有操作!
我们需要添加人更新检查文件的模板。这个其他教程都没有,我是在国外的官方教程上看到的。
热更新的原理就是每次启动app都会把本地的chcp.json文件和服务上的做对比。
chcp.json文件的内容如下:
服务器上的和这个内容格式是一样的。
每次app启动会检查本地的chcp.json文件中release的值是否和服务器中的一样,聪明的同学已经发行这个值是个时间。
如果不一样,就开始更新,更新时,app会先把本地的www文件夹复制一份,命名为服务器的release值,然后对比chcp.manifest文件
chcp.manifest文件的内容如下,他包含了www文件夹下所有的文件,而且都有hash值。更新时会 对比一下hash值,看看哪个文件变更了,就从content_url路径中下载相应的文件并复制到以服务器release的值命名的那个文件夹,这样比较省流量而且快。
update 后边的参数定义 下载好后什么时间更新,如果是start表示下次启动后再更新。如果是now表示下载好后立即更新。两种方式各有优缺点,你可以自己体验一样。
折中的是resume
表示从后台切换过来的时候安装更新。
更新后app就从以服务器release的值命名的那个文件夹加载资源文件。这样每次更新都会换一个资源文件夹,确保不会因为缓存导致看不到更新效果。
5.安装完cordova-hot-code-push-plugin 后www文件夹内就已经有chcp.json 和chcp.manifest ,但是我们修改index.html等文件后要怎么更新chcp.json 和chcp.manifest,当然不用手动更改release值,也不用手动改hash。
我们需要先生成一个chcp.json模板。
在工程目录下输入cordova-hcp init
需要输入名字,这里你填写app的名字即可,例如klkj (不要填中文哦)
amazon s3不用填(这是让你填你的亚马逊服务器和热更新文件放的位置,因为你没有亚马逊服务所以不用填。)
path s3 不用填
只用填这3个,其他直接按回车。update method 填start表示应用下次启动的时候再更新,填now表示下载好更新文件后直接更新,填resume
表示从后台切换过来的时候安装更新。
enter full url 填写你放更新文件的服务器的路径。
会在工程根目录生成cordova-hcp.json 文件
内容如下
ios_indentifier 和android_identifier 这两行可以删掉了,没什么用。
6.输入 cordova-hcp build 会在www文件中重新生成chcp.json chcp.manifest 其中chcp.json的release值就是输入命令的时间。
然后我们把整个www目录下的内容放到服务中,放在content_url这个路径中。我的是放在 www.zyyapp.com 这个网站的根目录下的www文件夹中。
7.修改config.xml文件,config.xml位于工程的更目录中。
添加
<chcp>
<config-file url="http://www.zyyapp.com/www/chcp.json"/>
</chcp>
8.打开Android studio
修改res-xml文件夹下的config.xml
9.把www下的文件复制到platforms\android\assets\www 文件,相同文件就覆盖。
用android studio把应用安装到手机。
更改下边文件夹中的index文件。
在命令提示符中运行
cordova-hcp build
这时候chcp.json 和chcp.manifest会更新。为了省事,你直接把www文件夹下的内容覆盖到服务器中。
你手机打开app,稍等一会,然后关了app重新打开。这时候应该就看到你更新的内容了。
教程到此结束,如果不懂得可以在下边留言。
ionic cordova 热更新(引用自www.zyyapp.com/post/116.html)的更多相关文章
- ionic cordova 热更新的一些问题
因为项目需要用到更新这一块的东西,所以就查了下cordova 的热更新,然后遇到了 一些问题,记录下来备忘. 项目用的是ionic 下载cordova的内容就直接跳过了. 首先是下载cordova的插 ...
- ionic cordova 热更新
因为项目需要,使用cordova的热更新插件,本地调试很简单,看连接https://github.com/nordnet/cordova-hot-code-push,就几步,这里不说了. 下面两个要装 ...
- Ionic APP 热更新 之 产品发布状态下的热更新搭建,去local-dev-addon插件
上一篇,我们介绍了在本地开发环境下的ionic项目热更新测试, 本文,我们将详细说明如何在去掉cordova-hot-code-push-local-dev-addon插件的情况下,实现热更新. 使用 ...
- Ionic APP 热更新
开门见山,本文主题:cordova-hot-code-push 作用:cordova热更新插件,提供了在应用程序中对基于Web的内容进行自动更新的功能. GitHub地址:https://github ...
- cordova热更新
cordova 热更新: 一.添加插件 1.新建Cordova项目 cordova create CordovaHotCode com.ezample.hotcode 2.添加Android平台 在新 ...
- Cordova热更新和App升级 - 简书
原文:Cordova热更新和App升级 - 简书 公司的cordova项目前段时间增加了热更新功能,自己第一次做的时候在网上查找了很多资料,有的资料写的并不全面遇到了很多坑.因此总结一些在开发过程中遇 ...
- ionic 3 热更新 Hot Code Push
最近用ionic 3 做的app业务做的差不多了,突然想到以后app如果有更新该怎么搞?想到我们的app后期更新应该不大,,最多就是改改bug和增加下用户体验,如果只有一些小的更新,然后提交各个应用商 ...
- Cordova热更新cordova-hot-code-push
原文转载自:https://www.cnblogs.com/huangenai/p/7137475.html cordova-hot-code-push ,Cordova热代码推送插件提供了在应用程序 ...
- cordova热更新插件的使用:cordova-hot-code-push-plugin
1. 添加插件:cordova plugin add cordova-hot-code-push-plugin 2. 先打开cli,执行命令 npm install -g cordova-hot-co ...
随机推荐
- NGUI Atlas Maker sprites with black line issue
NGUI图集中的图,在游戏中显示出来带有黑边的问题. 实际上是因为图片在导入到图集中,图片四周的完全透明的边缘部分会被裁掉,而在图集中的实际大小比图片原始大小小以及图集中图片之间的间距设置得太小导致. ...
- ionic ngCordova插件安装
ngCordova的安装配置 官网提供了两种安装的方法: 1. 使用bower来安装 2. 下载zip文件 推荐使用bower安装,在使用bower之前,我们电脑中需要先配置bower.bower的配 ...
- sprint one
产品backlog Id Name Imp Est How to demo 1 各个角色账号登录功能 30 20 建立数据库,数据库中存储一些角色的初始账号以便测试,输入账号密码,系统在数据库中查找账 ...
- asp.net登录时验证码的制作与验证
1.新建一个页面,ImageCode.aspx 2.在Page_Load中添加如下代码 string tmp = RndNum(4); HttpCookie a = new HttpCookie(&q ...
- vi编辑器 使用 命令
vi编辑器 1)命令模式 打开文件后.默认处于命令模式,命令模式无法编辑文件 2)输入模式 在命令模式下 按 i 进入输入模式,便于编辑文件内容 3)末行模式 编辑内容后,按esc进入到命令模式,再按 ...
- TcpListener 类
构造函数 名称 说明 TcpListener(IPAddress, Int32) 新实例初始化 TcpListener 类用于侦听传入的连接尝试在指定的本地 IP 地址和端口号. TcpL ...
- abap调vb写的dll实现电子天平的读数(带控件版)
废话不多说,直接上. 鉴于abap调研的dll文件需要在wins注册,自己尝试过delphi和C#感觉不是很好,最后毅然选择了VB来写 因为需要用到MScomm控件,所以对于将要写的dll需要带for ...
- webservice服务的简单应用
本人目前刚接触到webservice服务,知道它是一个为外部提供接口的服务,下面大概讲一下webservice是如何应用的. 在此我只针对ASP.NET 讲一个是如何应用的: 1. 打开VS ,在WE ...
- 苹果下如果安装nginx,给nginx安装markdown第三方插件
用brew install nginx 这样安装的是最新版的nginx, 但是在有些情况下,安装第三方插件需要特定的版本,更高一级的版本可能装不上. 它的原理是下载安装包进行自动安装,建立软链,这样就 ...
- React Native 获取网络数据
getMoviesFromApiAsync() { return fetch('http://facebook.github.io/react-native/movies.json') .then(( ...