React Native Andorid CodePush 热更新集成

 

CodePush

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

流程

1. 安装 CodePush CLI 。
2. 创建一个CodePush 账号
3. 在CodePush服务器注册app
4. 在app上添加CodePush SDK，配置升级相关代码。 ReactNative可以参考这里
5. 更新代码后，发布一个应用更新到服务器
6. app收到升级推送

一、安装CodePush CLI

管理 CodePush 账号需要通过 NodeJS-based CLI.

只需要在控制台输入 npm install -g code-push-cli ，就可以安装了。

安装完毕后，输入 code-push -v 查看版本代表成功。

目前我的版本是 1.1.1-beta

二、创建CodePush账号

在控制台输入 code-push register 后，将会打开一个网页进行注册

CodePush账号支持 github和 Microsofe，选其中一个就可以了。

我选择的是 github，授权完毕后，网页将会显示一个token，复制它到控制台的中就成功了。

成功登陆后，你的session文件将会写在 /Users/guanMac/.code-push.config。

相关命令

• code-push login 登陆
• code-push loout 注销
• code-push access-key ls 列出登陆的token
• code-push access-key rm <accessKye> 删除某个 access-key

三、在CodePush服务器上注册app

为了让codePush服务器知道你的app，我们需要向它注册app： code-push app add <appName> ，就可以了。

code-push app相关命令

• add 在账号里面添加一个新的app
• remove 或者 rm 在账号里移除一个app
• rename 重命名一个存在app
• list 或则 ls 列出账号下面的所有app
• transfer 把app的所有权转移到另外一个账号

四、在app中添加SDK，配置相关代码

由于我目前只开发了android，以下就以android为例。

第一步。在应用中安装react-native插件， npm install --save react-native-code-push

第二步。在Anroid project中安装插件。

CodePush提供了两种方式： RNPM 和 Manual 。

如果你不想依赖其他工具或者愿意走多几步额外的步骤，可以使用 Manual。不过像我这么懒的代码从业者，毫不犹豫地选择了 RNPM 这个实用工具。

第三步运行 npm i rnpm 安装 RNPM。

第四步运行 rnpm link react-native-code-push 。这条命令将会自动帮我们在anroid文件中添加好设置（其实就是通过Manual的安装步骤）

第五步在 android/app/build.gradle 文件里面添加额为的创建任务：

    apply from "react.gradle"
    apply from "../../node_modules/react-native-code-push/android/codepush.gradle"

第六步运行 code-push deployment ls <appName> 获取 部署秘钥 。默认的部署名是 staging ，所以 部署秘钥（deployment key ） 就是 staging的可以。

第七步添加配置。我们需要让app向CodePush咨询JS bundle的所在位置，这样CodePush就可以控制版本。更新MainActivity.java 文件：

 //1.引用包
 import com.microsoft.codepush.react.CodePush;
 public class MainActivity extends ReactActivity {
 //2.覆盖 getJSBundleFile 方法，让CodePush决定当app启动时，去哪里加载 JS bundle
    @Override
    protected String getJSBundleFile(){
        return CodePush.getBundleUrl():
    }
    
    @Override 
    protected List<ReactPackage> getPackages(){
        //实例化 CodePush运行时，把它添加到 packages,填写正确的 部署秘钥（ deployment key）
        return Arrays.<ReactPackage> as List(
            new MainReactPackage(),
            new CodePush("deployment-key-here" , this , BuildCofig.DEBUG)
        )
    }
    
 }
 

第八步在 android/app/build.gradle 中有个 android.defaultConfig.versionName 属性，我们需要把 应用版本改成 1.0.0（默认是1.0，但是codepush需要三位数）。

    android{
        defaultConfig{
            versionName "1.0.0"
        }
    }

第九步CodePush 插件下载和关联完毕后，就剩下在应用中部署更新控制策略：

• 在 js中加载 CodePush模块： import codePush from 'react-native-code-push'
• 在 componentDidMount 中调用 sync 方法，后台请求更新 codePush.sync()
• 或者 codePush.sync({ updateDialog:true, installMode:codePush.InstallMode.IMMEDIATE }); 弹出更新提示框。

以上就是在app中添加sdk和配置了。具体的还可以参考 官方文档

部署app相关命令

• code-push deployment add <appName> 部署
• code-push deployment rename <appName> 重命名
• code-push deployment rm <appName> 删除部署
• code-push deployment ls <appName> 列出应用的部署情况
• code-push deployment ls <appName> -k 查看部署的key
• code-push deployment history <appName> <deploymentNmae> 查看历史版本(Production 或者 Staging)

 

发布更新

code-push release-react MyApp-Android(code push中add 的项目名不是android studio中的项目名) android

 

 

 

• CodePush默认是更新 staging 环境的，如果是staging，则不需要填写 deploymentName。
• 如果有 mandatory 则会让客户端强制更新

 

发布release包，选择production的key之后，需要将代码推送到production的环境。

 

code-push release-react ZSKQAndroid android -d Production  （ZSKQAndroid 是 code push add的项目名）

 

 

 

• 对应的应用版本（targetBinaryVersion）是指当前app的版本，而不是你填写的更新版本。譬如客户端版本是 1.0.0，如果我们需要更新客户端，那么targetBinaryVersion填的就是 1.0.0。

 

重启app，会提示新版本更新，重新获取jsbundle进行更新。

 

• CodePush只能更新 js或图片，原生代码的改变（二进制打包）是不能通过它更新的。
• 服务端还木有开源，不能使用自己的服务器
• 服务端在美国，国内可能会不稳定。