快捷導(dǎo)航

淺談React原生APP更新

更新時(shí)間：2021年06月03日 14:31:20 作者：Grewer

當(dāng)一個(gè)APP在運(yùn)行的時(shí)候, 開(kāi)發(fā)者想要將自己的代碼更新到用戶(hù)的手機(jī)上時(shí), 一般都有兩種方案, 一是熱更新, 二就是APP更新.熱更新暫且不說(shuō),這篇文章就講講 APP 如何更新。

App更新流程

1.在 App 打開(kāi)時(shí)請(qǐng)求接口或文件, 獲取遠(yuǎn)程版本/版本更新說(shuō)明/地址等等重用信息

2.通過(guò)庫(kù)或者原生方案, 獲取 App 的當(dāng)前版本

3.比較遠(yuǎn)程版本和當(dāng)前版本的區(qū)別(可以使用庫(kù),也可以自己寫(xiě)一個(gè)比較方案)

4.通過(guò)獲取到的鏈接進(jìn)行操作(可以跳轉(zhuǎn)到對(duì)應(yīng)網(wǎng)站下載,類(lèi)似蒲公英這種,可以是 apk 鏈接, 通過(guò)安卓原生方法下載, 也可以是 App Store 鏈接)

大致的流程圖

詳細(xì)說(shuō)明:

1.這些遠(yuǎn)程信息,可以是接口, 這樣可以有一個(gè)中臺(tái)來(lái)控制, 當(dāng)然也可以是一個(gè)文件, 讓運(yùn)維來(lái)控制
關(guān)于信息,不止于遠(yuǎn)程版本, 在項(xiàng)目里還可以添加其他屬性,如: versionCode, versionCodeSwitch , notUpdate , deleteApp

1.1 versionCode 通過(guò) code 來(lái)升級(jí)版本,一般是一個(gè)數(shù)字(在 ios 里提交 App Store 的時(shí)候有需要用到的地方), 這樣 versionName 并不會(huì)增加, 但是如果添加了 versionCode, 如果要升級(jí) versionName, versionCode 也需要增加
1.2 versionCodeSwitch 用來(lái)控制是否要根據(jù)versionCode來(lái)更新, 一般我都是在測(cè)試和其他環(huán)境開(kāi)啟,生產(chǎn)環(huán)境關(guān)閉的
1.3 notUpdate 是否要根據(jù)遠(yuǎn)程信息來(lái)更新, 一般都是開(kāi)啟狀態(tài)
1.4 deleteApp 安卓 app 需要卸載重新安裝, 因?yàn)橹苯影惭b可能存在某些問(wèn)題, 將會(huì)使用此信息,先刪除 APP, 再重新下載

2.獲取當(dāng)前手機(jī)的信息,方案較多, 我使用的是 react-native-device-info 這個(gè)庫(kù), 這個(gè)庫(kù)里面提供的信息較全, 當(dāng)然也可以使用原生方法, 來(lái)獲取APP的信息

3.關(guān)于本地版本號(hào)和原生版本號(hào)之間的對(duì)比也是可以使用庫(kù),也可以自己寫(xiě), 這邊推薦兩個(gè)庫(kù),下載量都是百萬(wàn)以上的: semver-compare 和 compare-versions, 這邊附上我的 versionName 比較方案, 較為簡(jiǎn)陋:

/**
 * 比較兩版本號(hào) 
 * @param currentVersion 
 * @return boolean 
 * true=需要更新 false=不需要 
 */
compareVersion = (currentVersion: string): boolean => {
    const {versionName: remoteVersion} = this.remoteInfo || {}
    if (!remoteVersion) {
        return false
    }
    if (currentVersion === remoteVersion) {
        return false
    }
    const currentVersionArr = currentVersion.split('.')
    const remoteVersionArr = remoteVersion.split('.')
    for (let i = 0; i < 3; i++) {
        if (Number(currentVersionArr[i]) < Number(remoteVersionArr[i])) {
            return true
        }
    } 
    return false
}

關(guān)于下載 app 有很多方案, 最簡(jiǎn)單的就是跳轉(zhuǎn)鏈接到第三方平臺(tái), 像蒲公英這樣的, 使用 RN 提供的 Linking 方法來(lái)直接跳轉(zhuǎn)
當(dāng)然安卓是可以直接通過(guò)自己提供的地址下載的, 這里提供一個(gè)方法(此方法來(lái)源于網(wǎng)絡(luò)):

@ReactMethod
public void installApk(String filePath, String fileProviderAuthority) {
    File file = new File(filePath);
    if (!file.exists()) {
        Log.e("RNUpdater", "installApk: file doe snot exist '" + filePath + "'");
        // FIXME this should take a promise and fail it
 return;
    }
    if (Build.VERSION.SDK_INT >= 24) {
        // API24 and up has a package installer that can handle FileProvider content:// URIs
 Uri contentUri;
        try {
            contentUri = FileProvider.getUriForFile(getReactApplicationContext(), fileProviderAuthority, file);
        } catch (Exception e) {
            // FIXME should be a Promise.reject really
 Log.e("RNUpdater", "installApk exception with authority name '" + fileProviderAuthority + "'", e);
            throw e;
        }
        Intent installApp = new Intent(Intent.ACTION_INSTALL_PACKAGE);
        installApp.addFlags(Intent.FLAG_GRANT_READ_URI_PERMISSION);
        installApp.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
        installApp.setData(contentUri);
        installApp.putExtra(Intent.EXTRA_INSTALLER_PACKAGE_NAME, reactContext.getApplicationInfo().packageName);
        reactContext.startActivity(installApp);
    } else {
        // Old APIs do not handle content:// URIs, so use an old file:// style
 String cmd = "chmod 777 " + file;
        try {
            Runtime.getRuntime().exec(cmd);
        } catch (Exception e) {
            e.printStackTrace();
        }
        Intent intent = new Intent(Intent.ACTION_VIEW);
        intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
        intent.setDataAndType(Uri.parse("file://" + file), "application/vnd.android.package-archive");
        reactContext.startActivity(intent);
    }
}

如果是我們自己提供下載服務(wù),需要注意的是帶寬, 如果網(wǎng)速過(guò)慢則用戶(hù)體驗(yàn)過(guò)差, 還有就會(huì)帶來(lái)更多的流量消耗, 其中的取舍,需要開(kāi)發(fā)者決定

更新APP信息

在打包時(shí), 通過(guò)腳本更新接口或者文件信息, 當(dāng)然這個(gè)得看具體的打包方案
比如我現(xiàn)在的方案是使用 Jenkins 打包, 在打包時(shí)使用 shell 腳本更新對(duì)應(yīng)信息(有需要也可以使用其他語(yǔ)言腳本):

1.首先定義需要獲取的文件地址

androidVersionFilePath="$WORKSPACE/android/app/build.gradle"  // 通過(guò)此文件獲取安卓的版本信息
iosVersionFilePath="$WORKSPACE/ios/veronica/Info.plist" // 通過(guò)此文件獲取iOS的版本信息
changeLogPath="$WORKSPACE/change.log" // 將版本更新信息存儲(chǔ)在此文件中

2.通過(guò)文件地址, 獲取打完包后的版本信息

getAndroidVersion(){
  androidVersion=$(cat $androidVersionFilePath  | grep "versionName" | awk '{print $2}' | sed 's/\"http://g')
  androidCode=$(cat $androidVersionFilePath  | grep "versionCode " | awk '{print $2}' | sed 's/\"http://g')
  androidDelete=$(cat $androidVersionFilePath  | grep "deleteApp" | awk '{print $4}' | sed 's/\"http://g')
  return 0
}

getIOSVersion(){
  rows=$(awk '/CFBundleShortVersionString/ {getline; print}' $iosVersionFilePath)
  iosVersion=$(echo "$rows" | sed -ne 's/<string>\(.*\)<\/string>/\1/p')
  iosVersion=$(echo "$iosVersion" | sed 's/^[[:space:]]*//')

  rows2=$(awk '/VersionCode/ {getline; print}' $iosVersionFilePath)
  iosCode=$(echo "$rows2" | sed -ne 's/<string>\(.*\)<\/string>/\1/p')
  iosCode=$(echo "$iosCode" | sed 's/^[[:space:]]*//')
  return 0
}

desc=$(cat $changeLogPath | tr "\n" "#")

3.替換現(xiàn)有文件中的信息

sed -i '' "s/\"releaseInfo\":.*$/\"releaseInfo\": \"$desc\"/"  $JsonPath/$fileName
sed -i '' "s/\"versionName\":.*$/\"versionName\": \"$versionName\",/"  $JsonPath/$fileName
sed -i '' "s/\"versionCode\":.*$/\"versionCode\": \"$versionCode\",/"  $JsonPath/$fileName
sed -i '' "s/\"deleteApp\":.*$/\"deleteApp\": \"$deleteApp\",/"  $JsonPath/$fileName

我的文件是以 json 作為格式的,說(shuō)明文字是可以任意填寫(xiě)的,會(huì)觸發(fā)一些解析問(wèn)題: