【React Native】热更新

Android应用打包

Android要求所有应用都有一个数字签名才允许安装在用户手机上,需要生成一个签名的APK包。

打包步骤:

  1. 生成离线Bundle资源文件。
  2. 生成签名秘钥。
  3. 利用签名秘钥生成release的APK文件。
  4. 发布到应用市场提供用户下载安装。

PUSHY热更新

热更新一般用于Android平台为主,因为Apple禁止了热更新行为。

  • 热更新原理
    React Native的热更新更像是原生App的版本更新。
    React Native的而加载启动流程可总结为:React Native将一系列资源打包成JS Bundle文件,系统加载js bundle文件来解析并渲染页面,具体细节:

    1.通过Restful服务获取服务端Bundle文件的版本。
    2.将本地缓存的版本信息和服务器的版本信息进行比较,判断是否需要更新
    3.如果需要更新,则从服务器下载最新的bundle文件并实现更新即可。如果没有更新,则加载assets目录下的index.android.bundle文件。
    

LA011872

  • 热更新的配置文件
安装命令
npm install -g react-native-update-cli rnpm
npm install --save react-native-update @4.x(@的具体版本如下图)
react-native link react-native-update
react native 版本react-native-update版本
0.26以下1.0x
0.27~0.282x
0.29~0.333x
0.34~当前4x

如果react-native的版本低于0.29,react-native link react-native-update替换为rnpm link

CodePush热更新

1、安装 CodePush CLI
安装CodePush指令,直接在终端上输入如下命令即可,注意:这个CodePush指令只需要全局安装一次即可,如果第一次安装成功了,那后面就不在需要安装

$ npm install -g code-push-cli

2、注册 CodePush账号

code-push register

输入命令后出现如下网页,选择github登录,在cmd中输入登录之后得到的秘钥,登录成功。
在这里插入图片描述
在这里插入图片描述

CodePush注册登录相关命令:
code-push login 登陆
code-push loout 注销
code-push access-key ls 列出登陆的token
code-push access-key rm 删除某个 access-key

CodePush管理App的相关命令:
code-push app list //查看添加的App
code-push app add 在账号里面添加一个新的app
code-push app remove 或者 rm 在账号里移除一个app
code-push app rename 重命名一个存在app
code-push app list 或则 ls 列出账号下面的所有app
code-push app transfer 把app的所有权转移到另外一个账号

3、在CodePush服务器注册App

//添加Android平台应用命令
code-push app add iOSRNHybridForAndroid Android react-native

输入命令后,成功就会返回对应的production 和 Staging 两个key,production代表生产版的热更新部署,Staging代表开发版的热更新部署。
android中复制在ApplicationgetPackagesCodePush中。
在这里插入图片描述

React-Native连接codePush

列出账号下的所有项目: code-push app list
查询部署环境的key:code-push deployment ls appName -k
//appName 为自己app list的名字
在这里插入图片描述在这里插入图片描述

//终端进入你的项目根目录然后运行
npm install --save react-native-code-push
//输入命令将会自动帮我们在anroid文件中添加好设置
rnpm link react-native-code-push
//在终端运行此命令之后,终端会提示让你输入deployment key,这是你只需将你的deployment Staging key输入进去即可,如果不输入则直接单击enter跳过即可。

//在 android/app/build.gradle文件里面添如下代码:
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
//然后在/android/settings.gradle中添加如下代码:

include ':react-native-code-push'
project(':react-native-code-push').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-code-push/android/app')

添加配置。当APP启动时我们需要让app向CodePush咨询JS bundle的所在位置,这样CodePush就可以控制版本。更新 MainApplication.java文件:

public class MainApplication extends Application implements ReactApplication {
	  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
	    @Override
	    protected boolean getUseDeveloperSupport() {
	      return BuildConfig.DEBUG;
	    }
	    @Override
	    protected String getJSBundleFile() {
	      return CodePush.getJSBundleFile();
	    }
	    @Override
	    protected List<ReactPackage> getPackages() {
	      // 3. Instantiate an instance of the CodePush runtime and add it to the list of
	      // existing packages, specifying the right deployment key. If you don't already
	      // have it, you can run "code-push deployment ls <appName> -k" to retrieve your key.
	      return Arrays.<ReactPackage>asList(
	        new MainReactPackage(),
	        new CodePush("deployment-key-here", MainApplication.this, BuildConfig.DEBUG)
	      );
	    }
	  };
	  @Override
	  public ReactNativeHost getReactNativeHost() {
	      return mReactNativeHost;
	  }
}

关于deployment-key的设置
在build.gradle中的设置方法如下:

//打开android/app/build.gradle文件,找到android { buildTypes {} }然后添加如下代码即可:

android {
    ...
    buildTypes {
        debug {
            signingConfig signingConfigs.debug
            resValue "string", "CodePushDeploymentKey", ""
        }
        release {
            // Caution! In production, you need to generate your own keystore file.
            // see https://facebook.github.io/react-native/docs/signed-apk-android.
            signingConfig signingConfigs.debug
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
            resValue "string", "CodePushDeploymentKey", "key"
        }
         releaseStaging {
            //这里的key为Staging的key
            resValue "string", "CodePushDeploymentKey", "key"
            matchingFallbacks = ['release']
        }
    }
    ...
}

在android/app/build.gradle设置好deployment-key之后呢,我们就可以这样使用了:

  public ArrayList<ReactPackage> getPackages() {
    return new ArrayList<>(Arrays.<ReactPackage>asList(
		new CodePush(getResources().getString(R.string.CodePushDeploymentKey), getApplicationContext(), BuildConfig.DEBUG),
		));
  }

修改versionName。
在 android/app/build.gradle中有个 android.defaultConfig.versionName属性,我们需要把 应用版本改成 1.0.0(默认是1.0,但是codepush需要三位数)

android {
    defaultConfig {
        applicationId "applicationId"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 5
        versionName "1.2.7"
        multiDexEnabled true
        manifestPlaceholders = [
                JPUSH_APPKEY: "APPKey", //在此替换你的APPKey
                APP_CHANNEL: "developer-default"    //应用渠道号
        ]
    }
 }

至此Code Push for Android的SDK已经集成完成。

使用CodePush进行热更新

设置更新策略
在使用CodePush更新你的应用之前需要,先配置一下更新控制策略,即:

1.什么时候检查更新?(在APP启动的时候?在设置页面添加一个检查更新按钮?)
什么时候可以更新,如何将更新呈现给终端用户?
最简单的方式是在根component中进行上述策略控制。

在 js中加载 CodePush模块:
import codePush from 'react-native-code-push’

2.在 componentDidMount中调用 sync方法,后台请求更新codePush.sync()
如果可以进行更新,CodePush会在后台静默地将更新下载到本地,等待APP下一次启动的时候应用更新,以确保用户看到的是最新版本。
如果更新是强制性的,更新文件下载好之后会立即进行更新。
如果你期望更及时的获得更新,可以在每次APP从后台进入前台的时候去主动的检查更新:
在应用的根component的componentDidMount中添加如下代码:

AppState.addEventListener("change", (newState) => {
    newState === "active" && codePush.sync();
});

发布更新

CodePush支持两种发布更新的方式,一种是通过code-push release-react简化方式,另外一种是通过code-push release的复杂方式

1.通过code-push release-react

code-push release-react MyApp-Android android --t 1.0.0 --dev false --d Production --des "1.优化操作流程" --m true

其中参数–t为二进制(.ipa与apk)安装包的的版本;–dev为是否启用开发者模式(默认为false);–d是要发布更新的环境分Production与Staging(默认为Staging);–des为更新说明;–m 是强制更新。

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值