Skip to main content

ビットライズコードプッシュ

Bitriseは、Bitrise認証と統合されたホスト型CodePushサーバーを提供しています。リリース管理の React Native アプリや Expo アプリと一緒に使用することができます

パブリックベータ

Bitrise CodePushは現在パブリックベータ版です。 お問い合わせ下さい。 そうすることで、お客様のためにこの機能を有効にすることができます。

パブリックベータには、1 か月あたり 100,000 件のプッシュ更新が含まれています。さらに必要な場合はお知らせください

コードプッシュについて

CodePush を使用すると、React Native 開発者はモバイルアプリのアップデートをユーザーのデバイスに直接デプロイできます。このサービスは次の 2 つの部分で構成されています。

Bitrise CodePush ServerはマイクロソフトのCodePushサーバーをベースにしており、リリース管理の一部です。リリース管理が必要です。 アプリ ご利用のCodePushデプロイメント経由でBitrise CodePushサーバーにアップデートパッケージをプッシュできるようにするため。

API のみ

CodePush サーバー機能は現在、以下から利用できます。 リリース管理 API。GUI は開発中です。

コードプッシュを有効にする

Bitrise CodePushは現在パブリックベータ版です。Bitriseにワークスペースでこの機能を有効にするようリクエストできます。この機能を有効にすると、そのワークスペースのすべてのアプリで CodePush を使用できます

  1. リリース管理にログインします。

  2. メインページで、 コードプッシュ カード。

  3. クリック アクセスをリクエスト。

  4. ダイアログで、 リクエストを送信。

  5. この機能を有効にすると、アクセスを確認するメールが届きます。

CodePush デプロイメントの作成

パブリックベータ

Bitrise CodePushは現在パブリックベータ版です。 お問い合わせ下さい。 そうすることで、お客様のためにこの機能を有効にすることができます。

パブリックベータには、1 か月あたり 100,000 件のプッシュ更新が含まれています。さらに必要な場合は、お問い合わせください。

  1. 必ずお持ちください 個人アクセストークン または ワークスペース API トークン。

    リリース管理 API による認証にはトークンが必要です。

  2. React Nativeプロジェクトごとに、次のものがあることを確認してください 2 つのアプリ リリース管理では、1 つは iOS 用、もう 1 つは Android 用です。

  3. Get the app ID for each app. You can see it in the URL of the app page: https://app.bitrise.io/release-management/workspaces/<worskspace-id>/connected-apps/<connected-app-id>.

    API からの ID

    あなたはできる API を使用してアプリを追加できます。。の応答 /connected-apps エンドポイントには id フィールド:これは必要なアプリ ID です。

  4. を呼び出して、各アプリケーションの CodePush デプロイメントを作成します。 /connected-apps/{connected_app_id}/code-push/deployments エンドポイント。リクエストには以下が必要です。

    • 接続アプリケーション ID。

    • 認証用のトークン。

    • デプロイに使用する名前。

    この例では、という名前を使用しています prod:

     curl -X 'POST' \
  'https://api.bitrise.io/release-management/v1/connected-apps/<connected-app-id>/code-push/deployments' \
  -H 'accept: application/json' \
  -H 'authorization: <access-token>' \
  -H 'Content-Type: application/json' \
  -d '{
    "name": "prod"
  }'

    既存のデプロイメントキー

    すでにお持ちの場合 deploymentKey (たとえば、Microsoft アプリセンターからセットアップを移行する場合)、以下を使用できます。 key API リクエストのパラメータ:

    {
    "name": "prod",
    "key": "<existing-deploymentKey>"
}

  5. base64 でエンコードされたものをコピーする key レスポンスで返されました。これは CodePush デプロイキーです。これが必要なのは アプリケーションを CodePush 用に構成してください。。

CodePush 用にアプリを設定する

CodePush SDK をインストールし、デプロイキーと CodePush サーバー URL をアプリ設定に追加します。このプロセスは React Native アプリと Expo アプリでは異なります

React ネイティブアプリ用のコードプッシュの設定

CodePush for React Nativeを使用するには、SDKをインストールしてから、iOSモジュールとAndroidモジュールの両方にCodePushをセットアップする必要があります。

バージョン要件

CodePushNext SDK はリアクトネイティブ 0.76 以降をサポートしています。

  1. React ネイティブコードプッシュインストール次へ:

    npm install @code-push-next/react-native-code-push

  2. 用コードプッシュを設定します。最も重要な手順は以下のとおりです iOS セットアップ。

    詳細な手順は、SDK の GitHub リポジトリにあります。 iOS。

  3. 用の CodePush をセットアップします。最も重要な手順は以下のとおりです アンドロイドセットアップ。

    詳細な手順は、SDK の GitHub リポジトリにあります。 アンドロイド。

iOS セットアップ

  1. バンドル ID が、次の場合に使用したバンドル ID と一致することを確認してください Bitrise でアプリを作成する。使えます react-native-rename アプリの名前をカスタムバンドル ID に変更するには: リアクション・ネイティブ・リネーム。

  2. で ios/Podfile、次の行を探してください platform :ios、 min_ios_version_supported。次のように変更してください platform :ios, 15.5。

  3. Update ios/<projectname>/AppDelegate.swift:

    1. CodePush ヘッダーのインポートステートメントを追加します。

      import CodePush

    2. 次のコード行を見つけてください。

      Bundle.main.url(forResource: "main", withExtension: "jsbundle")

    3. これを次の行に置き換えてください。

      CodePush.bundleURL()

    4. きみの bundleURL メソッドは以下のようになるはずです。

      override func bundleURL() -> URL? {
#if DEBUG
   RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: "index")
#else
   CodePush.bundleURL()
#endif
}

  4. Add the CodePush deployment key and the CodePush Server URL to ios/<projectname>/Info.plist:

    デプロイキーは、作成時に取得します Bitriseへのコードプッシュ・デプロイ。

    ワークスペーススラッグ

    サーバーURLにはBitriseワークスペーススラッグが必要です。 スラグでワークスペースとプロジェクトを識別する。

    #The CodePush deployment key

<key>CodePushDeploymentKey</key>
<string></string>

#The CodePush server URL with the Bitrise workspace slug

<key>CodePushServerURL</key>
<string>https://<workspace-slug>.codepush.bitrise.io</string>

アンドロイドセットアップ

  1. 末尾に行を追加 android/app/build.gradle 追加のビルドタスク定義として:

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

  2. [更新] android/app/build.gradle android.defaultConfig セットアップするには versionCode と versionName:

    versionCode System.getenv("APP_VERSION_CODE") != null ? System.getenv("APP_VERSION_CODE").toInteger() : 1
versionName System.getenv("APP_VERSION_NAME") != null ? System.getenv("APP_VERSION_NAME") : "1.0"

  3. [更新] android/app/src/main/java/…/MainApplication.kt CodePush を使用するには:

    パッケージリスト

    PackageList は、アプリケーションの存続期間中に一度だけインスタンス化する必要があります。

    ...
// 1. Import the plugin class.
import com.microsoft.codepush.react.CodePush

class MainApplication : Application(), ReactApplication {
   override val reactNativeHost: ReactNativeHost =
       object : DefaultReactNativeHost(this) {
           override fun getPackages(): List<ReactPackage> = PackageList(this).packages.apply {
             // Packages that cannot be autolinked yet can be added manually here, for example:
             // add(MyReactNativePackage())
            }

           // 2. Override the getJSBundleFile method in order to let
           // the CodePush runtime determine where to get the JS
           // bundle location from on each app start
           override fun getJSBundleFile(): String {
             return CodePush.getJSBundleFile() 
           }
    };
}

  4. で android/app/src/main/res/value/strings.xmlで、CodePush デプロイキーと CodePush サーバー URL を追加します。

    デプロイキーは、作成時に取得します Bitriseへのコードプッシュ・デプロイ。

    ワークスペーススラッグ

    サーバーURLにはBitriseワークスペーススラッグが必要です。 スラグでワークスペースとプロジェクトを識別する。

    <string name="CodePushDeploymentKey" translatable="false"><CODE_PUSH_DEPLOYMENT_KEY></string>
<string name="CodePushServerUrl" translatable="false">https://<workspace-slug>.codepush.bitrise.io</string>

Expo アプリ向けコードプッシュの設定

  1. 変換 app.json に app.config.js これにより、環境変数を使用できるようになります。

    詳細については、以下をご覧ください 動的設定に関する Expo ドキュメント。

  2. を設定 apps ios.bundleIdentifier と android.package で app.config.js。これらは、使用中の値と一致する必要があります アプリを作成する。 ビットライズで。

  3. リアクトネイティブコードプッシュネクストSDKをインストールし、 dotenv、および expo-build-properties パッケージ:

    npm install @code-push-next/react-native-code-push dotenv expo-build-properties

  4. エキスポコードプッシュプラグインのセットアップ:

    • プラグインをに含める app.config.js。

      ワークスペーススラッグ

      サーバーURLにはBitriseワークスペーススラッグが必要です。 スラグでワークスペースとプロジェクトを識別する。

       plugins: [
        [
        "@code-push-next/react-native-code-push/expo", // CodePush plugin
          {
            ios: {
                // Use the environment variable for the iOS CodePush Deployment Key
                CodePushDeploymentKey: IOS_CODE_PUSH_DEPLOYMENT_KEY,
                CodePushServerURL: "https://<workspace-slug>.codepush.bitrise.io" 
            },
            android: {
                // Use the environment variable for the Android CodePush Deployment Key
                CodePushDeploymentKey: ANDROID_CODE_PUSH_DEPLOYMENT_KEY,
                CodePushServerURL: "https://<workspace-slug>.codepush.bitrise.io" 
            }
          }
        ],
        [
          "expo-build-properties",
          {
            ios: {
              deploymentTarget: "15.5"
            }

          }
        ]
        // Add other plugins here if you have more
      ]

  5. デプロイキー値をに追加 .env ファイル。デプロイキーは次の場合に取得されます CodePush デプロイメントを作成しています。 ビットライズで。

    ヒント

    を追加 .env ファイルをあなたの .gitignore 鍵を秘密にしておくためだ!

    # .env file

# CodePush Deployment Keys
IOS_CODE_PUSH_DEPLOYMENT_KEY=""
ANDROID_CODE_PUSH_DEPLOYMENT_KEY=""

CodePush アップデートの作成とリリース

アップデートバンドルを作成し、Bitrise CodePush Serverにアップロードして、ユーザーのデバイスにアップデートをプッシュします。

アップデートバンドルの作成

リアクトネイティブ

博覧会

  1. コードを更新してください。

  2. iOS と Android の両方に対応するアップデートバンドルを作成します。

    • iOS:

      npx react-native bundle \
  --platform ios \
  --dev false \
  --entry-file index.js \
  --bundle-output ./build/main.jsbundle \
  --assets-dest ./build

    • アンドロイド:

      npx react-native bundle \
  --platform android \
  --dev false \
  --entry-file index.js \
  --bundle-output ./build/index.android.bundle \
  --assets-dest ./build

  3. ビルドフォルダを圧縮します。

    zip -r update.zip ./build

  1. コードを更新してください。

  2. iOS と Android の両方に対応するアップデートバンドルを作成します。

    • iOS:

      npx expo export:embed \
  --entry-file index.js \
  --platform ios \
  --dev false \
  --reset-cache \
  --bundle-output ./build/main.jsbundle \
  --assets-dest ./build \
  --minify false

    • アンドロイド:

      npx expo export:embed \
  --entry-file index.js \
  --platform android \
  --dev false \
  --reset-cache \
  --bundle-output ./build/index.android.bundle \
  --assets-dest ./build \
  --minify false

  3. ビルドフォルダを圧縮します。

    zip -r update.zip ./build

Bitrise CodePush サーバーにパッケージをアップロードする

  1. クローンを作成 release-management-recipes Bitrise のリポジトリ。

    リポジトリには、更新パッケージのアップロードに使用するヘルパースクリプトが含まれています。

    git clone https://github.com/bitrise-io/release-management-recipes

  2. にアクセスしてください release-management-recipes フォルダー:

    cd release-management-recipes

  3. スクリプトを実行してアップロードします。

    スクリプトには入力データが必要です。

    最後のコマンドは次のようになるはずです。

    PACKAGE_PATH=../update.zip \
AUTHORIZATION_TOKEN=<api-token> \
CONNECTED_APP_ID=<connected-app-id> \
DEPLOYMENT_ID=<deployment-id> \
APP_VERSION=<app-version>  /bin/bash ./api/upload_code_push_package.sh
このセクションの内容: