React Native SDKでオンボーディングを取得する

オンボーディングは SDK v4 で非推奨となり、将来のリリースで削除される予定です。 バグ修正や改善は行われません。代わりにフローを使用してください。オンボーディングは WebView 内で動作しますが、フローはデバイス上でネイティブにレンダリングされるため、よりスムーズなアニメーション、一貫したネイティブの外観、高速な読み込み時間、WebView ランタイムへの依存がなくなります。まずはフローとペイウォールの取得とフローとペイウォールの表示をご覧ください。

Adapty ダッシュボードのビルダーでオンボーディングのビジュアル部分をデザインしたら、React Native アプリで表示できます。まず、プレースメントに関連付けられたオンボーディングとそのビュー設定を以下の手順で取得します。

始める前に、以下を確認してください：

Adapty React Native SDK バージョン 3.8.0 以上をインストール済みであること。
オンボーディングを作成済みであること。
オンボーディングをプレースメントに追加済みであること。

オンボーディングを取得する

ノーコードビルダーでオンボーディングを作成すると、アプリが取得・表示するためのコンテナとして設定が保存されます。このコンテナはエクスペリエンス全体を管理します。表示されるコンテンツ、その見せ方、そしてユーザーの操作（クイズの回答やフォームへの入力など）の処理がすべて含まれます。また、コンテナはアナリティクスイベントを自動的に追跡するため、ビューのトラッキングを別途実装する必要はありません。

パフォーマンスを最大限に発揮するために、ユーザーに表示する前に画像のダウンロードが完了するよう、早めにオンボーディングの設定を取得しておいてください。オンボーディングを取得するには、getOnboarding メソッドを使用します：

try {
    const placementId = 'YOUR_PLACEMENT_ID';
    const locale = 'en';

    const onboarding = await adapty.getOnboarding(placementId, locale);
    // 取得したオンボーディング
} catch (error) {
    // エラーを処理する
}

次に、createOnboardingView メソッドを呼び出してビューインスタンスを作成します。

createOnboardingView メソッドの戻り値は一度しか使用できません。再度使用する必要がある場合は、createOnboardingView メソッドを新たに呼び出してください。再作成せずに二度呼び出すと、AdaptyUIError.viewAlreadyPresented エラーが発生する場合があります。

// for the Adapty SDK < 3.14 – import {createOnboardingView} from 'react-native-adapty/dist/ui';

if (onboarding.hasViewConfiguration) {
    try {
        const view = await createOnboardingView(onboarding);
    } catch (error) {
        // handle the error
    }
} else {
    //use your custom logic
}

パラメーター:

パラメータ	必須/任意	説明
placementId	必須	対象のプレースメントの識別子です。Adapty ダッシュボードでプレースメントを作成する際に指定した値を使用します。
locale	任意デフォルト: `en`	オンボーディングのローカライゼーション識別子です。マイナス（-）文字で区切られた1つまたは2つのサブタグで構成される言語コードを指定してください。最初のサブタグは言語、2番目のサブタグは地域を表します。例: `en` は英語、`pt-br` はブラジルポルトガル語を表します。ロケールコードとその推奨の使い方については、ローカライゼーションとロケールコードをご覧ください。
fetchPolicy	デフォルト: `.reloadRevalidatingCacheData`	デフォルトでは、SDK はサーバーからデータの読み込みを試み、失敗した場合はキャッシュされたデータを返します。この設定を推奨します。ユーザーが常に最新のデータを受け取れるためです。ただし、ユーザーがインターネット接続の不安定な環境にいると考えられる場合は、`.returnCacheDataElseLoad` を使用してキャッシュデータが存在すればそれを返すようにすることをご検討ください。この場合、ユーザーが最新データを受け取れないことがありますが、接続状況にかかわらず読み込み時間が短くなります。キャッシュは定期的に更新されるため、セッション中にネットワークリクエストを避ける目的で使用しても問題ありません。キャッシュはアプリの再起動後も保持され、アプリの再インストール時または手動でクリアした場合にのみ削除されます。 Adapty SDK はオンボーディングをローカルに2層で保存します。1つは上記の定期更新されるキャッシュ、もう1つはフォールバックオンボーディングです。また、オンボーディングをより高速に取得するためにCDNを使用し、CDNに到達できない場合のためにスタンドアロンのフォールバックサーバーも用意しています。このシステムは、インターネット接続が不安定な状況でも信頼性を確保しながら、常に最新バージョンのオンボーディングを取得できるよう設計されています。
loadTimeoutMs	デフォルト: 5秒	このメソッドのタイムアウト上限を設定します。タイムアウトに達した場合、キャッシュされたデータまたはローカルフォールバックが返されます。内部で複数のリクエストが発生する場合があるため、まれに `loadTimeout` で指定した時間よりもわずかに遅くタイムアウトすることがあります。
レスポンスパラメータ：

パラメータ	説明
Onboarding	`AdaptyOnboarding` オブジェクト。オンボーディングの識別子と設定、リモートコンフィグ、およびその他のプロパティを含みます。

デフォルトオーディエンスのオンボーディングでフェッチを高速化する

通常、オンボーディングはほぼ即座にフェッチされるため、このプロセスを高速化することを心配する必要はありません。ただし、オーディエンスやオンボーディングが多数あり、ユーザーのインターネット接続が不安定な場合、オンボーディングのフェッチに予想以上の時間がかかることがあります。そのような状況では、オンボーディングをまったく表示しないよりも、デフォルトのオンボーディングを表示してスムーズなユーザー体験を確保したいと思うかもしれません。 getOnboardingForDefaultAudience メソッドを使用することで、指定したプレースメントの All Users オーディエンス向けオンボーディングを取得できます。ただし、推奨されるアプローチは getOnboarding メソッドを使用してオンボーディングを取得することであり、詳細は上記のオンボーディングの取得セクションをご覧ください。

getOnboardingForDefaultAudience の代わりに getOnboarding の使用を検討してください。前者には重要な制限があります：

互換性の問題: 複数のアプリバージョンをサポートする際に問題が生じる可能性があり、後方互換性のある設計が必要になるか、古いバージョンで表示が崩れることを許容する必要があります。
パーソナライズなし: 「全ユーザー」オーディエンス向けのコンテンツのみ表示され、国・アトリビューション・カスタム属性に基づくターゲティングは利用できません。

取得速度の向上がこれらのデメリットを上回る場合は、以下に示す getOnboardingForDefaultAudience を使用してください。そうでない場合は、上記で説明した getOnboarding を使用してください。

try {
    const placementId = 'YOUR_PLACEMENT_ID';
    const locale = 'en';

    const onboarding = await adapty.getOnboardingForDefaultAudience(placementId, locale);
    // リクエストされたオンボーディング
} catch (error) {
    // エラーを処理する
}

パラメーター:

パラメータ必須/任意説明

placementId 必須対象のプレースメントの識別子です。Adapty ダッシュボードでプレースメントを作成する際に指定した値です。

パラメータ	必須/任意	説明
placementId	必須	対象のプレースメントの識別子です。Adapty ダッシュボードでプレースメントを作成する際に指定した値です。
locale	任意デフォルト: `en`	オンボーディングのローカライズ識別子です。このパラメータは、マイナス（-）文字で区切られた1つまたは2つのサブタグで構成される言語コードである必要があります。最初のサブタグは言語を、2つ目は地域を表します。例: `en` は英語、`pt-br` はブラジルポルトガル語を表します。ロケールコードとその推奨される使い方については、ローカライズとロケールコードを参照してください。
fetchPolicy	デフォルト: `.reloadRevalidatingCacheData`	デフォルトでは、SDK はサーバーからデータを取得しようとし、失敗した場合はキャッシュされたデータを返します。ユーザーが常に最新のデータを受け取れるため、このオプションを推奨します。ただし、ユーザーがネットワーク接続の不安定な環境にいると想定される場合は、`.returnCacheDataElseLoad` を使用してキャッシュデータが存在すればそれを返すことを検討してください。この場合、ユーザーが受け取るデータが最新でない可能性はありますが、接続状況に関わらず読み込みが速くなります。キャッシュは定期的に更新されるため、セッション中にネットワークリクエストを避ける目的で利用しても問題ありません。キャッシュはアプリを再起動しても保持され、アプリのアンインストール時または手動でクリーンアップした場合にのみ削除されます。 Adapty SDK はオンボーディングをローカルに2つの層で保存します。1つは上記の定期更新キャッシュ、もう1つはフォールバックオンボーディングです。また、オンボーディングをより高速に取得するために CDN を使用し、CDN が利用できない場合に備えてスタンドアロンのフォールバックサーバーも用意しています。このシステムは、インターネット接続が不安定な状況でも信頼性を確保しながら、常に最新バージョンのオンボーディングを取得できるよう設計されています。

locale

任意

デフォルト: en

オンボーディングのローカライズ識別子です。このパラメータは、マイナス（-）文字で区切られた1つまたは2つのサブタグで構成される言語コードである必要があります。最初のサブタグは言語を、2つ目は地域を表します。

例: en は英語、pt-br はブラジルポルトガル語を表します。

ロケールコードとその推奨される使い方については、ローカライズとロケールコードを参照してください。

fetchPolicy

デフォルト: .reloadRevalidatingCacheData

デフォルトでは、SDK はサーバーからデータを取得しようとし、失敗した場合はキャッシュされたデータを返します。ユーザーが常に最新のデータを受け取れるため、このオプションを推奨します。

ただし、ユーザーがネットワーク接続の不安定な環境にいると想定される場合は、.returnCacheDataElseLoad を使用してキャッシュデータが存在すればそれを返すことを検討してください。この場合、ユーザーが受け取るデータが最新でない可能性はありますが、接続状況に関わらず読み込みが速くなります。キャッシュは定期的に更新されるため、セッション中にネットワークリクエストを避ける目的で利用しても問題ありません。

キャッシュはアプリを再起動しても保持され、アプリのアンインストール時または手動でクリーンアップした場合にのみ削除されます。

Adapty SDK はオンボーディングをローカルに2つの層で保存します。1つは上記の定期更新キャッシュ、もう1つはフォールバックオンボーディングです。また、オンボーディングをより高速に取得するために CDN を使用し、CDN が利用できない場合に備えてスタンドアロンのフォールバックサーバーも用意しています。このシステムは、インターネット接続が不安定な状況でも信頼性を確保しながら、常に最新バージョンのオンボーディングを取得できるよう設計されています。