React Native Android CodePush Hot Update Integration

 

CodePush

CodePush is a cloud server developed by Microsoft. Through it, developers can deploy mobile app updates directly on users' devices. CodePush is equivalent to a central repository. Developers can push current updates (including JS/HTML/CSS/IMAGE, etc.) to CoduPush, and then the application will check for updates. (Welcome to follow  my gitHub  )

process

1. Install  CodePush CLI  .
2. Create a CodePush account
3. Register the app with the CodePush server
4. Add the CodePush SDK to the app and configure the upgrade-related code. ReactNative can refer to here
5. After updating the code, publish an app update to the server
6. The app receives an upgrade push

1. Install CodePush CLI

Managing CodePush accounts requires a NodeJS-based CLI.

Just type in the console  npm install -g code-push-cli and you can install it.

After the installation is complete, enter to  code-push -v view the version on behalf of success.

Currently my version is 1.1.1-beta

2. Create a CodePush account

After entering in the console  code-push register , a web page will open for registration

CodePush accounts support github and Microsoft, just choose one of them.

I chose github. After the authorization is completed, the webpage will display a token, and it is successful to copy it to the console.

After successful login, your session file will be written in /Users/guanMac/.code-push.config.

Related commands

• code-push login login
• code-push loout log out
• code-push access-key ls List login tokens
• code-push access-key rm <accessKye> delete an access-key

3. Register the app on the CodePush server

为了让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或图片，原生代码的改变（二进制打包）是不能通过它更新的。
• 服务端还木有开源，不能使用自己的服务器
• 服务端在美国，国内可能会不稳定。