CodePush 热更新 Cordova 集成(cordova-plugin-code-push)

CodePush 是一个微软开发的云服务器。通过它,开发者可以直接在用户的设备上部署手机应用更新。CodePush 相当于一个中心仓库,开发者可以推送当前的更新(包括JS/HTML/CSS/IMAGE等)到 CoduPush,然后应用将会查询是否有更新。

一、安装 CodePush CLI

$ npm install -g code-push-cli # 首先要安装Node.js
$ code-push -v #2.1.9

二、创建CodePush账号、并登录

$ code-push register
#Please login to Mobile Center in the browser window we've just opened.
#Enter your token from the browser:

会自动打开注册界面,可以用GitHub账户授权登录

登录后自动打开下面界面,按提示复制token

复制token到终端,即可完成注册

相关命令:

$ code-push whoami
$ code-push login #登陆
$ code-push logout #注销
$ code-push access-key ls #列出登陆的token
$ code-push access-key rm #删除某个 access-key

三、在CodePush服务器上注册app

创建一个名为 test-android 的安卓应用:

# code-push app add <appName> <os> <platform> 
$ code-push app add test-android android cordova

可以看到生成的对应的key, Production和Staging分别为生产环境和开发环境

相关命令:

$ code-push app add <appName> <os> <platform> 
# code-push app add MyApp-iOS ios react-native 添加 iOS(os)、react-native(platform) 应用
# code-push app add MyApp-Android android cordova 添加 android(os)、cordova(platform) 应用
$ code-push app list/ls #列出账号下面的所有app
$ code-push app remove/rm <appName>
$ code-push app rename <appName> <newAppName>
$ code-push app transfer <appName> <newOwnerEmail> #把app的所有权转移到另外一个账号

$ code-push collaborator add <appName> <collaboratorEmail> #添加协作者
$ code-push collaborator rm <appName> <collaboratorEmail> #删除协作者
$ code-push collaborator ls <appName> #列出应用下列出所有的参与者

$ code-push release-cordova <appName> <platform> #发布更新
$ code-push release-react <appName> <platform> #发布更新

$ code-push deployment add <appName> <deploymentName> #增加开发环境
$ code-push deployment rm <appName> <deploymentName> #移除开发环境
$ code-push deployment rename <appName> <deploymentName> <newDeploymentName> #开发环境换名字
$ code-push deployment ls <appName> #列出所有的开发环境
$ code-push deployment ls <appName> --displayKeys/-k #列出所有的开发环境和对应access-key
$ code-push deployment clear <appName> <deploymentName> #清除更新记录

四、Cordova集成

插件:cordova-plugin-code-push
地址:https://github.com/Microsoft/cordova-plugin-code-push

1、cordova 项目创建

$ cordova create codePushDemo com.example.codePushDemo CodePushDemo
$ cd codePushDemo
$ cordova platform add android

2、cordova 项目安装插件

$ cordova plugin add cordova-plugin-code-push@latest
$ cordova plugin add cordova-plugin-whitelist

3、修改 config.xml, 添加 CodePushDeploymentKey

<platform name="android">
<preference name="CodePushDeploymentKey" value="${CodePushDeploymentKey}" />
</platform>

4、修改 config.xml

<access origin="https://codepush.appcenter.ms" />
<access origin="https://codepush.blob.core.windows.net" />
<access origin="https://codepushupdates.azureedge.net" />
# 如果设置了 <access origin="*" /> 请忽略

5、修改 www/index.html, 添加 meta

<meta http-equiv="Content-Security-Policy" content="default-src https://codepush.appcenter.ms 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *" />

6、修改 www/js/index.js

var app = {
...
onDeviceReady: function() {
window.codePush.sync(null, {
updateDialog: true,
installMode: InstallMode.IMMEDIATE
});
...
},
...
};

app.initialize();

7、发布更新

$ cordova build Android  #打包apk  手机安装
$ code-push release-cordova test-android android -d "Staging" --des "描述" #发布更新
$ code-push deployment ls test-android -k #查看发布状态

$ code-push release-cordova <appName> <platform> [options]
# 选项:
# --build, -b [布尔-默认:false] Invoke "cordova build" instead of "cordova prepare"
# --isReleaseBuildType, --rb [布尔-默认:false] If "build" option is true specifies whether perform a release build
# --deploymentName, -d [字符串-默认:"Staging"] Deployment
# --description, --des [字符串-默认:null] 描述
# --disabled, -x [布尔-默认:false] Specifies whether this release should be immediately downloadable
# --mandatory, -m [布尔-默认:false] Specifies whether this release should be considered mandatory
# --privateKeyPath, -k Specifies the location of a RSA private key to sign the release with [字符串] [默认值: false]
# --noDuplicateReleaseError [布尔-默认:false] When this flag is set, releasing a package that is identical to the latest release will produce a warning instead of an error
# --rollout, -r Percentage of users this release should be immediately available to [字符串] [默认值: "100%"]
# --targetBinaryVersion, -t [字符串-默认:null] Semver expression that specifies the binary app version(s) this release is targeting (e.g. 1.1.0, ~1.2.3). If omitted, the release will target the exact version specified in the config.xml file.
# -v, --version 显示版本号 [布尔]

可以看到发布状态

修改index.html

<!-- 增加下面一段 -->
<div>
<p >没错这是codepush更新过来的内容</p>
</div>

重新build、codepush发布后,重启应用,即可查看效果:

评论

目录
  1. 一、安装 CodePush CLI
  2. 二、创建CodePush账号、并登录
  3. 三、在CodePush服务器上注册app
  4. 四、Cordova集成