メインコンテンツにジャンプ
チュートリアル

Capgoの更新チャネルを実行時で切り替える方法: チャンネルサーフィング

Capgoの実行時チャネル切り替えで、特定のユーザーに即時変更を配信する。 Capacitorアプリを再インストールせずに更新チャネルを切り替える。

マーティン・ドナディュー

マーティン・ドナディュー

コンテンツマーケター

Capgoの更新チャネルを実行時で切り替える方法: チャンネルサーフィング

あなたは、テストフライトまたはGoogle Playから新しいビルドをダウンロードしてインストールすることなく、特定のユーザーに直接変更を送信し、即時レビューとフィードバックを受け取ることができるかもしれませんか?

私は、顧客から要求された改善を迅速に実装できましたが、結果を彼らの手元に届けるには、すべてのユーザーにアップデートを配信すること(実験的な変更のリスク)または、顧客用に一時的にビルドを作成すること(私たちの両方にとっての手間)を余儀なくされていました。

開発者は、非技術的なステークホルダー、QA、または適切な場合のユーザー全体に異なるアップデートを提供することができるようにする必要がありました。

生産ビルドは、ワークインプログレス版に切り替え、フィードバックを収集し、次に生産に戻ることができませんでした。

それが チャンネルサーフィング で実現されます。ユーザーのデバイスにインストールされたアプリは、実行時でアップデートチャンネルを切り替えることができ、生産アプリをレビューと反復のための柔軟なスペースに変えるのではなく、固定のエンドポイントにします。この機能は、非技術的なステークホルダーが生産アプリを使用して変更をテストし、直接フィードバックを提供できるようにするのに特に役立ちます。

アップデートチャンネルの理解

アップデートチャンネルは、Capgoが特定のビルドにアップデートを送信する方法です。各ビルドはチャンネルと関連付けられており、そのチャンネルはどのアップデートを受け入れるかを決定します。

たとえば、ユーザーに影響を与えないようにアップデートを preview チャンネル production. 過去、チャンネルを切り替えるには、別のネイティブビルドをインストールするか、ダッシュボードを通じてデバイスの割り当てを手動で変更する必要がありました。

チャンネルは Capgo で、以下の機能を提供します。

  • 特定のユーザーグループに異なる機能を提供
  • A/Bテストを実行するためにユーザーを異なるチャンネルに割り当てる
  • 新機能を段階的にロールアウトする
  • ベータテストプログラムを作成する
  • 個々のユーザーを通じてプロダクションの問題をデバッグする

更新チャンネルについては、 Capgo のチャンネルドキュメント が詳しく説明しています。

チャンネルサーフィングとは何か?

チャンネルサーフィングは、インストール済みのアプリが、再インストールせずに異なる更新ストリームからデータを取得できる機能です。インストール済みのアプリは、実行時には更新チャンネルを切り替えることができ、切り替えたチャンネルから更新を受け続けるまで、またはアプリをアンインストールするまで続きます。

In practice, this means a product owner or QA can switch a production build to, for example, a preview channel, try out the latest changes. When they are done testing, they switch back to production again. There’s no need for a reinstall or a separate preview build.

チャンネルサーフィングの実装

Before you can try channel surfing, your project needs to be configured with __CAPGO_KEEP_0__ Live Updates. To set that up, follow the

Capgo quickstart guide Capgo quickstart guide.

No Capgo changes or config modifications needed beyond that. チャンネルサーフィングの基本は、1 つの code の呼び出しによって動かされています:

This sets the channel that is used when querying API for updates.

import { CapacitorUpdater } from '@capgo/capacitor-updater';

await CapacitorUpdater.setChannel({ channel: 'your-channel' });

This sets the channel that is used when querying Capgo for updates. setChannel APIについてもっと学びましょう.

即時チャネル切り替え (v5.34.0+)

プラグインバージョン 5.34.0、6.34.0、7.34.0、または 8.0.0 から始めて (あなたのメジャーバージョンに応じて) setChannel() は大幅に高速化され、機能が異なります:

  1. バックエンド検証 (読み取り専用): Capgo バックエンドにリクエストを送信して、チャネルが許可されているかどうかを検証します
  2. ローカルストレージの更新: 検証が成功すると、チャネルはデバイスのローカルストレージに保存されます
  3. 即時効果: 次の更新チェックでは、新しいチャネルが即座に使用されます

以前は setChannel() APIの保存をバックエンドデータベースに保存 (ダッシュボードやAPIの変更と同様)。デバイスは、2分以内に新しいチャンネルが認識されるまで、バックエンドの再複製を待つ必要がありました。新しい動作は、バックエンドからのみ読み取り (検証用) して、ローカルに保存するため、チャンネル切り替えは即時になります。

完全なチャンネル切り替えフロー

より良いユーザー体験を実現するには、チャンネルを切り替えただけでは、次のアプリ再起動を待つだけではありません。一般的なアプローチは、すぐにアップデートを確認し、利用可能であればダウンロードし、アプリを再読み込みして、ユーザーが選択したチャンネルのアップデートに直接到達するようにすることです。

一般的なフローは次のようになります。

  1. チャンネルを変更する (setChannel)
  2. アップデートを確認する (getLatest)
  3. アップデートを取得して適用する (download, set または next)
  4. アプリを再読み込みする必要がある場合 (reload)

ここでは、完全な例を示します。

import { CapacitorUpdater } from '@capgo/capacitor-updater';

async function switchChannel(selectedChannel: string) {
  try {
    // 1. Set the updates channel (with optional auto-update trigger)
    await CapacitorUpdater.setChannel({
      channel: selectedChannel,
      triggerAutoUpdate: true // Immediately check for updates
    });

    console.log(`Switched to channel: ${selectedChannel}`);

    // If you want more control, handle the update manually:
    // const latest = await CapacitorUpdater.getLatest();
    // if (latest.url) {
    //   const bundle = await CapacitorUpdater.download({
    //     url: latest.url,
    //     version: latest.version
    //   });
    //   await CapacitorUpdater.set({ id: bundle.id });
    // }

  } catch (error) {
    console.error('Failed to switch channel:', error);
  }
}

// Switch to the beta channel
switchChannel('beta');

このフローをどのように構成するかはあなた次第です。ステップを複数のインタラクションに分割したり、すべて一度に実行したりすることができます。どのように構成するかはあなた次第ですが、失敗を考慮するようにしてください。ネットワークの問題や無効なチャンネルなど、アップデートを適用できない原因は何でもあります。

唯一の要件:自己割り当てを有効にする

このようにするだけでチャンネルサーフィングが可能になります。 アプリがチャンネルを切り替えることができるようになる前に、 setChannel(), you must enable self-assignment for that channel in the Capgo dashboard:

  1. Capgo ダッシュボードの チャンネル section in your Capgo dashboard
  2. 管理したいチャンネルの名前をクリックしてください。
  3. 「デバイスが自己割り当てを許可する」 を有効にします。
  4. 変更を保存します。

チャンネル設定で自己割り当てを有効にします。

それだけです。アプリの設定変更は必要ありません。 defaultChannel 設定が必要です。チャンネルを切り替えることを許可したいユーザーがいるチャンネルに、自我割り当てを有効にします。

この設定が無効になっている場合、チャンネルを呼び出す任何試みは失敗し、イベントが発生します。 setChannel() チャンネル channelPrivate チャンネルを切り替えることを許可したいユーザーがいるチャンネルの一覧

このAPIは、自我割り当てが有効になっているチャンネルのみを返します。

現在のチャンネルを確認する

const { channels } = await CapacitorUpdater.listChannels();

console.log('Available channels:', channels.map(c => c.name));
// Use this to build a channel selector UI

デバイスが現在割り当てられているチャンネルを確認します。

デフォルトのチャンネルに戻す

チャンネルオーバーライドを削除し、デフォルトに戻します。

const { channel } = await CapacitorUpdater.getChannel();

console.log('Current channel:', channel);

デバイスを特定のチャンネルから解除し、デフォルトのチャンネルに戻します。

デバイスが特定のチャンネルに割り当てられていることを解除し、デフォルトのチャンネルに戻します。

await CapacitorUpdater.unsetChannel({});

デバイスが特定のチャンネルに割り当てられていることを解除し、デフォルトのチャンネルに戻します。 defaultChannel configまたはクラウドのデフォルト設定で。

チャンネルサーフィングのテスト方法

チャンネルサーフィングの実行を確認するには、リリースビルドが必要です - @capgo/capacitor-updater APIはリリースビルド用に設計されています。デバッグビルドの場合、アプリは通常、開発サーバーからJavaScriptを読み込むのではなく、正常な更新フローをバイパスします。

前提条件

チャンネルサーフィングの唯一の要件は、 “Allow devices to self associate” on each channel you want to allow switching to. No config changes are needed in your app.

Creating a Test Build

Build your app as usual:

bun run build && npx cap sync

Then create your native builds using Xcode or Android Studio, or use your CI/CD pipeline. The app will start on whichever channel is set as the cloud default in your Capgo dashboard.

各チャンネルでチャネルサーフィングを許可する場合に、

__CAPGO_KEEP_0__をインストールした後、異なるチャンネルにアップデートを公開します。

# Publish to preview channel
npx @capgo/cli@latest bundle upload --channel preview

# Publish to production channel
npx @capgo/cli@latest bundle upload --channel production

__CAPGO_KEEP_0__から、チャンネル切り替えUIに移動し、チャンネル切り替えをトリガーします。アプリは選択したチャンネルからアップデートを取得し、更新されたアップデートにリロードする必要があります。

チャンネル切り替えUIの作成

チャンネルサーフィングは、通常、すべてのユーザーに公開したくない機能です。たとえば、ユーザーが認証された従業員のみに、プレビュー チャンネルにアプリを切り替えるボタンを提供することができます。

チャンネル切り替えUIの例として、次のReactコンポーネントがあります。

import { useState, useEffect } from 'react';
import { CapacitorUpdater } from '@capgo/capacitor-updater';

export function ChannelSwitcher() {
  const [currentChannel, setCurrentChannel] = useState<string>('');
  const [availableChannels, setAvailableChannels] = useState<string[]>([]);
  const [isLoading, setIsLoading] = useState(false);

  useEffect(() => {
    loadChannelInfo();
  }, []);

  async function loadChannelInfo() {
    const { channel } = await CapacitorUpdater.getChannel();
    setCurrentChannel(channel || 'default');

    const { channels } = await CapacitorUpdater.listChannels();
    setAvailableChannels(channels.map(c => c.name));
  }

  async function handleChannelSwitch(channel: string) {
    setIsLoading(true);
    try {
      await CapacitorUpdater.setChannel({
        channel,
        triggerAutoUpdate: true
      });
      setCurrentChannel(channel);
      // App will update in background or on next restart
    } catch (error) {
      console.error('Failed to switch channel:', error);
    } finally {
      setIsLoading(false);
    }
  }

  return (
    <div>
      <p>Current channel: {currentChannel}</p>
      <div>
        {availableChannels.map(channel => (
          <button
            key={channel}
            onClick={() => handleChannelSwitch(channel)}
            disabled={isLoading || channel === currentChannel}
          >
            Switch to {channel}
          </button>
        ))}
      </div>
    </div>
  );
}

チャンネルサーフィングの注意点

これらはすべてチャンネルサーフィングに特有のものではありませんが、実行時にチャンネルを切り替えるとすぐに現れます。

実行時バージョン不一致

Capgoのアップデートは、ネイティブアプリのバージョンと紐付けられています。ネイティブアプリのバージョンとインストール済みアプリのバージョンが一致しない場合、更新はダウンロードされずに適用されません。チャンネルサーフィングの場合、通常、チャンネルを切り替えると、アップデートが存在しているにもかかわらず、アップデートが適用されないことがあります。

この場合、アップデートは異なるネイティブバージョンのアプリから公開された可能性があります。ネイティブバージョンとインストール済みのバージョンが互換性があることを確認してください。

アップデートの削除または取り消し

アプリがすでにチャンネルにアップデートをダウンロードしている場合、Capgo ダッシュボードからアップデートを削除しても、すでにアップデートをダウンロードしているデバイスからアップデートを削除することはできません。削除は、すでにアップデートをダウンロードしているデバイスからアップデートをダウンロードすることを止めるだけです。 将来 ダウンロード。

The most reliable way to undo a bad update is to publish a known-good update to the same channel. This creates a new update at the top of the channel’s history, which clients will treat as the latest version and apply instead.

Capgo also provides a rollback mechanism that can instruct clients to re-apply a previous stable update or fall back to the update embedded in the build.

データ移行に関する考慮事項

チャンネルを切り替えることは、Appが実行するJavaScriptバンドルを変更します。アプリがチャンネル間で互換性のないマイグレーションまたはデータシェイプに依存している場合、前後両方のチャンネル間で切り替えることで問題が発生する可能性があります。

チャンネルサーフィングは、特にプロダクション環境で変更を迅速にレビューする必要がある場合に便利です。

迅速な検証

急いで修正するバグが検証される必要がある場合、チャンネルサーフィングを使用すると、変更が小規模なユーザーに限定され、検証される前にプロダクションに広く展開されるのを防ぐことができます。

利害関係者レビュー

__CAPGO_KEEP_0__

__CAPGO_KEEP_0__

__CAPGO_KEEP_0__

__CAPGO_KEEP_1__

__CAPGO_KEEP_2__

__CAPGO_KEEP_3__

  • __CAPGO_KEEP_4____CAPGO_KEEP_5__
  • __CAPGO_KEEP_6____CAPGO_KEEP_7__
  • __CAPGO_KEEP_8____CAPGO_KEEP_9__
  • __CAPGO_KEEP_10____CAPGO_KEEP_11__
  • デバッグ: 特定のユーザーをデバッグチャネルに切り替えて問題を診断する

チャネル変更方法の比較

方法効果時間保存先使用例
setChannel() プラグインから即時デバイスのみ (ローカル)アプリ内でユーザーがトリガーするチャネル切り替え
デバイスのオーバーライド (ダッシュボード)2分以内バックエンドデータベース特定のデバイスのための管理者が行う変更
API チャンネル割り当て2分以内バックエンドデータベース自動化されたバックエンド統合

チャンネル切り替えUIを作成する際の最良のユーザー体験を確保するには、常にプラグインの setChannel() method.

ベストプラクティス

  1. アクセス制限チャンネルサーフィングは通常内部用途です - すべてのユーザーに公開しないでください
  2. エラーを処理する: チャネルを切り替えるときは、常にエラーを優雅に処理する
  3. 互換性を検証する: インストールされているネイティブ版と異なるチャネルでの更新は、互換性があることを確認する
  4. チャネルを記録する: 各チャネルが何のためにあるかを明確に記録する
  5. 使用状況を監視する: デバッグ用に、どのデバイスがどのチャネルにいるかを追跡する

リソース

Conclusion

チャンネルサーフィングは、Capacitor アプリの開発を大幅に変える。生産用ビルドを固定のエンドポイントとして扱うのではなく、テスト、検証、迅速な開発のための柔軟なツールとして扱うことができるようになる。

最近のプラグインバージョンで導入された即時チャンネル切り替えにより、体験はすでにシームレスになりました - ユーザーはチャンネルを切り替えると、すぐに新しいチャンネルからの更新を受け取ることができます。

バグ修正の検証にスタッフと協力すること、ベータプログラムの実行、特定のユーザーと問題をデバッグすることなど、どのようなシナリオでもチャンネルサーフィングは、正しいアップデートを正しいユーザーに正しいタイミングで配信できるようにすることができます。

Channel Surfing for Capgo の続き:実行時でアップデートチャンネルを切り替える方法

__CAPGO_KEEP_0__ を使用している場合 Channel Surfing for Capgo の続き:実行時でアップデートチャンネルを切り替える方法 を使用してチャンネルルーティングとステージドロールアウトを計画し、接続するには Channels チャンネルに関する実装詳細については、Channels を参照してください。 Channels Channelsの実装詳細については Channels Channelsの実装詳細については ベータテストソリューション ベータテストソリューションの製品ワークフローについて、 バージョン目標ソリューション バージョン目標ソリューションの製品ワークフローについて。

Capacitorアプリのリアルタイム更新

Capgoのウェブ層バグが生じた場合、ユーザーにバックグラウンドで更新を提供し、ネイティブの変更は通常のレビュー経路で保つ

今すぐ始めよう

ブログの最新記事

Capgoは、プロフェッショナルなモバイルアプリを作成するために必要な最良の洞察を提供します。