react應用更新引入react-native-code-push

1. Install the CodePush CLI 建立codepush賬号

   npm install -g code-push-cli

   建立賬号：code-push register (彈出注冊視窗，注冊後會生成一串碼）

   （可以用code-push login 登入，然後生成一個檔案.注意網絡問題會到隻不成功，多操作幾次）

   注冊應用名字 code-push app add MyApp

2.在項目的根目錄下執行

npm install –save react-native-code-push

3.在android/settings.gradle 增加

include ‘:app’, ‘:react-native-code-push’

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

修改 android/app/build.gradle 增加

…

dependencies {

…

compile project(‘:react-native-code-push’)

}

Plugin Configuration (Android)

Update the MainActivity.java file to use CodePush via the following changes:

…

// 1. Import the plugin class

import com.microsoft.codepush.react.CodePush;

// 2. Optional: extend FragmentActivity if you intend to show a dialog prompting users about updates.

public class MainActivity extends FragmentActivity implements DefaultHardwareBackBtnHandler {

…

@Override
protected void onCreate(Bundle savedInstanceState) {
    ...
    // 3. Initialize CodePush with your deployment key and an instance of your MainActivity.
    CodePush codePush = new CodePush("d73bf5d8-4fbd-4e55-a837-accd328a21ba", this);
    ...
    mReactInstanceManager = ReactInstanceManager.builder()
            .setApplication(getApplication())
            ...
            // 4. DELETE THIS LINE --> .setBundleAssetName("index.android.bundle")

            // 5. Let CodePush determine which location to load the most updated bundle from.
            // If there is no updated bundle from CodePush, the location will be the assets
            // folder with the name of the bundle passed in, e.g. index.android.bundle
            .setJSBundleFile(codePush.getBundleUrl("index.android.bundle"))

            // 6. Expose the CodePush module to JavaScript.
            .addPackage(codePush.getReactPackage())
            ...
}
           

}

….

修改android/app/build.gradle 中的android.defaultConfig.versionName，預設是1.0修改為1.0.0開始

android {

…

defaultConfig {

…

versionName “1.0.0”

…

}

…

}

插件用法：

最簡單的方式就是在應用啟動的元件中引入以下方法：

a.引入元件CodePush

var CodePush = require(“react-native-code-push”)

b.在應用啟動的方法中調用

CodePush.sync();

提供2中方式：

一種是Silent mode (預設就是這種，會自動下載下傳更新，并在下次重新開機應用的時候生效）

eg:

CodePush.sync();

另一種是Active mode（當有更新的時候會有提示，可以有一些模式提供選擇可以參考接口）

eg:

codePush.sync({ updateDialog: true, installMode: codePush.InstallMode.IMMEDIATE });

codepush提供的接口如下：

checkForUpdate: 檢查是否用東西要更新

getCurrentPackage: 擷取最新包的一些資訊如 ( description, installation time, size).

notifyApplicationReady: 通知 CodePush 你有新應用要釋出

restartApp:更新應用并重新開機應用

sync: 檢查更新、下載下傳、并安裝也可以定制化一些提示資訊