# REACT-NATIVE - Adapty Documentation (Full Content) This file contains the complete content of all documentation pages for this platform. Locale: ja Generated on: 2026-06-24T14:36:28.585Z Total files: 44 --- # File: sdk-installation-react-native-expo --- --- title: "ExpoプロジェクトにAdapty React Native SDKをインストール・設定する" description: "サブスクリプションアプリ向けに、ExpoプロジェクトでAdapty React Native SDKをインストールするステップバイステップガイド。" --- :::important このガイドは、**ExpoプロジェクトへのAdapty React Native SDKのインストールと設定**を説明します。 **純粋なReact Native（Expoなし）**を使用している場合は、代わりに[React Nativeインストールガイド](sdk-installation-react-native-pure)をご覧ください。 ::: Adapty SDKには、React Nativeアプリへのシームレスな統合に必要な2つの主要モジュールが含まれています： - **Core Adapty**：アプリでAdaptyを正しく動作させるために必要なモジュールです。 - **AdaptyUI**：クロスプラットフォームのペイウォールを簡単に作成できるノーコードツール[Adapty ペイウォールビルダー](adapty-paywall-builder)を使用する場合に必要なモジュールです。AdaptyUIはコアモジュールと同時に自動的に有効化されます。 React NativeアプリでIAPを実装する方法の完全なチュートリアルが必要な場合は、[こちら](https://adapty.io/blog/react-native-in-app-purchases-tutorial/)をご覧ください。 :::tip Adapty SDKがExpoアプリにどのように統合されているかの実際の例を見たい方は、サンプルアプリをご確認ください： - [Expo dev buildサンプル](https://github.com/adaptyteam/AdaptySDK-React-Native/tree/master/examples/FocusJournalExpo)：実際の購入やペイウォールビルダーを含む全機能向け - [Expo Go & Webサンプル](https://github.com/adaptyteam/AdaptySDK-React-Native/tree/master/examples/ExpoGoWebMock)：モックモードでのテスト向け ::: 完全な実装ウォークスルーは、以下の動画でも確認できます：
## 要件 \{#requirements\} Adapty React Native SDKはiOS 13.0以降をサポートしていますが、[Adapty ペイウォールビルダー](adapty-paywall-builder)で作成したペイウォールを使用するにはiOS 15.0以降が必要です。 :::info SDK v3.17以降、Adapty SDKはデフォルトでGoogle Play Billing Library v8.0.0を使用します。 ::: --- no_index: true --- import Callout from '../../../components/Callout.astro'; SDKのインストールは、Adaptyセットアップのステップ5です。アプリ内で課金が機能するようにするには、アプリをストアに接続し、Adapty ダッシュボードでプロダクト、ペイウォール、プレースメントを作成する必要があります。[クイックスタートガイド](quickstart)では、必要なすべての手順を説明しています。 ## Adapty SDKをインストールする \{#install-adapty-sdk\} [![Release](https://img.shields.io/github/v/release/adaptyteam/AdaptySDK-React-Native.svg?style=flat&logo=react)](https://github.com/adaptyteam/AdaptySDK-React-Native/releases) :::important ExpoプロジェクトでAdaptyを使用するには、[Expo Dev Client](https://docs.expo.dev/versions/latest/sdk/dev-client/)（カスタム開発ビルド）が必要です。 Expo Goはカスタムネイティブモジュールをサポートしていないため、UI/ロジックの開発には[**モックモード**](#set-up-mock-mode-for-expo-go--expo-web)でのみ使用できます（実際の購入やAdaptyUI/ペイウォールビルダーのレンダリングは不可）。 ::: 1. Adapty SDKをインストールします（`@adapty/core`も自動的にインストールされます）： ```sh npx expo install react-native-adapty npx expo prebuild ``` 2. EASまたはローカルビルドを使用して開発用のアプリをビルドします： ```sh # For iOS eas build --profile development --platform ios # For Android eas build --profile development --platform android ``` ```sh # For iOS npx expo run:ios # For Android npx expo run:android ``` 3. devサーバーを起動します： ```sh npx expo start --dev-client ``` ## Adapty SDKのAdaptyモジュールを有効化する \{#activate-adapty-module-of-adapty-sdk\} **Public SDK Key** を取得するには： 1. Adapty ダッシュボードを開き、[**App settings → General**](https://app.adapty.io/settings/general) に移動します。 2. **Api keys** セクションから **Public SDK Key**（Secret Key ではない方）をコピーします。 3. コード内の `"YOUR_PUBLIC_SDK_KEY"` を置き換えます。 :::important - Adapty の初期化には必ず **Public SDK key** を使用してください。**Secret key** は[サーバーサイド API](getting-started-with-server-side-api) 専用です。 - **SDK keys** はアプリごとに固有です。複数のアプリがある場合は、正しいキーを選択してください。 ::: Adaptyを有効化するために、以下のコードを`App.tsx`にコピーしてください： ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY'); ``` :::important 他のAdapty SDKメソッドを呼び出す前に、`activate`の完了を待ってください。完全なシーケンスについては[React Native SDKの呼び出し順序](react-native-sdk-call-order)をご覧ください。 ::: 次に、アプリでペイウォールを設定します： - [Adapty ペイウォールビルダー](adapty-paywall-builder)を使用する場合は、[ペイウォールビルダーのクイックスタート](react-native-quickstart-paywalls)に従ってください。 - 独自のペイウォールUIを構築する場合は、[カスタムペイウォールのクイックスタート](react-native-quickstart-manual)をご覧ください。 :::tip 開発環境でのアクティベーションエラーを回避するには、[ヒント](#development-environment-tips)をご参照ください。 ::: ## Adapty SDKのAdaptyUIモジュールを有効化する \{#activate-adaptyui-module-of-adapty-sdk\} [ペイウォールビルダー](adapty-paywall-builder)を使用する場合は、AdaptyUIモジュールが必要です。コアモジュールを有効化すると自動的に有効化されるため、追加の設定は不要です。 ## オプション設定 \{#optional-setup\} ### ログ \{#logging\} #### ログシステムを設定する \{#set-up-the-logging-system\} Adaptyはエラーやその他の重要な情報をログに記録し、何が起きているかを把握できるようにします。以下のレベルが使用可能です： | レベル | 説明 | | ---------- | ------------------------------------------------------------ | | `error` | エラーのみログに記録されます | | `warn` | エラーと、重大なエラーは発生しないがSDKからの注意すべきメッセージがログに記録されます | | `info` | エラー、警告、および各種情報メッセージがログに記録されます | | `verbose` | 関数呼び出しやAPIクエリなど、デバッグ時に役立つ追加情報がすべてログに記録されます | ログレベルはAdaptyの設定前または設定中に設定できます： ```typescript showLineNumbers title="App.tsx" // Set log level before activation // 'verbose' is recommended for development and the first production release adapty.setLogLevel('verbose'); // Or set it during configuration adapty.activate('YOUR_PUBLIC_SDK_KEY', { logLevel: 'verbose', }); ``` ### データポリシー \{#data-policies\} Adaptyは明示的に送信しない限りユーザーの個人データを保存しませんが、ストアや国のガイドラインに準拠するための追加のデータセキュリティポリシーを実装できます。 #### IPアドレスの収集と共有を無効にする \{#disable-ip-address-collection-and-sharing\} Adaptyモジュールを有効化する際に、`ipAddressCollectionDisabled`を`true`に設定すると、ユーザーのIPアドレスの収集と共有を無効にできます。デフォルト値は`false`です。 このパラメータは、ユーザープライバシーの強化、地域のデータ保護規制（GDPRやCCPAなど）への準拠、またはIPベースの機能がアプリに不要な場合の不必要なデータ収集の削減に使用します。 ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { ipAddressCollectionDisabled: true, }); ``` #### 広告IDの収集と共有を無効にする \{#disable-advertising-id-collection-and-sharing\} Adaptyモジュールを有効化する際に、`ios.idfaCollectionDisabled`（iOS）または`android.adIdCollectionDisabled`（Android）を`true`に設定すると、広告識別子の収集を無効にできます。デフォルト値は`false`です。 このパラメータは、App Store/Play Storeのポリシーへの準拠、アプリトラッキングの透明性プロンプトの回避、または広告IDに基づく広告アトリビューションや分析がアプリに不要な場合に使用します。 ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { ios: { idfaCollectionDisabled: true, }, android: { adIdCollectionDisabled: true, }, }); ``` #### AdaptyUIのメディアキャッシュ設定をカスタマイズする \{#set-up-media-cache-configuration-for-adaptyui\} デフォルトでは、AdaptyUIはパフォーマンス向上とネットワーク使用量削減のためにメディア（画像や動画など）をキャッシュします。カスタム設定を指定してキャッシュ設定をカスタマイズできます。 `mediaCache`を使用してデフォルトのキャッシュ設定を上書きします： ```typescript adapty.activate('YOUR_PUBLIC_SDK_KEY', { mediaCache: { memoryStorageTotalCostLimit: 200 * 1024 * 1024, // Optional: memory cache size in bytes memoryStorageCountLimit: 2147483647, // Optional: max number of items in memory diskStorageSizeLimit: 200 * 1024 * 1024, // Optional: disk cache size in bytes }, }); ``` パラメータ： | パラメータ | 必須 | 説明 | |-----------|----------|-------------| | memoryStorageTotalCostLimit | 任意 | メモリ内のキャッシュ合計サイズ（バイト単位）。デフォルトはプラットフォーム固有の値。 | | memoryStorageCountLimit | 任意 | メモリストレージのアイテム数上限。デフォルトはプラットフォーム固有の値。 | | diskStorageSizeLimit | 任意 | ディスク上のファイルサイズ上限（バイト単位）。デフォルトはプラットフォーム固有の値。 | ### ローカルアクセスレベルを有効にする（Android） \{#enable-local-access-levels-android\} デフォルトでは、[ローカルアクセスレベル](local-access-levels)はiOSでは有効、Androidでは無効になっています。Androidでも有効にするには、`localAccessLevelAllowed`を`true`に設定します： ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { android: { localAccessLevelAllowed: true, }, }); ``` ### バックアップ復元時にデータをクリアする \{#clear-data-on-backup-restore\} `clearDataOnBackup`を`true`に設定すると、SDKはアプリがiCloudバックアップから復元されたことを検知し、キャッシュされたプロファイル情報、プロダクト詳細、ペイウォールなど、ローカルに保存されているSDKデータをすべて削除します。その後SDKはクリーンな状態で初期化されます。デフォルト値は`false`です。 :::note 削除されるのはローカルSDKキャッシュのみです。Appleとのトランザクション履歴およびAdaptyサーバー上のユーザーデータは変更されません。 ::: ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { ios: { clearDataOnBackup: true }, }); ``` ## 開発環境のヒント \{#development-environment-tips\} #### Expo Go / Expo Web向けにモックモードを設定する \{#set-up-mock-mode-for-expo-go--expo-web\} Expo GoおよびExpo Web環境では、Adaptyのネイティブモジュールにアクセスできません。ランタイムエラーを回避しながら、アプリのUIとペイウォールロジックのビルド・テストを続けられるよう、Adaptyは**モックモード**を提供しています。 ::::important モックモードは実際の購入をテストするためのツールでは**ありません**： - App Store / Google Playの購入フローを**開きません**し、実際のトランザクションを**作成しません**。 - **Adapty ペイウォールビルダー（AdaptyUI）**で作成したペイウォール/オンボーディングを**レンダリングしません**。 - Adaptyのネイティブモジュールは**完全にバイパス**されるため、Xcode/AndroidビルドにネイティブSDKファイルが存在しない場合や無効なAPIキーを使用しても、エラーは発生しません。 実際の購入とペイウォールビルダーのペイウォールをテストするには、モックモードが自動的に無効になるExpo Dev Client / プロダクションビルドを使用してください。 :::: **デフォルトでは**、SDKはExpo GoおよびWeb環境を自動的に検出してモックモードを有効にします。モックデータをカスタマイズしたい場合を除き、何も設定する必要はありません。 モックモードが有効な場合： - すべてのAdaptyメソッドはAdaptyサーバーへのネットワークリクエストを行わずにモックデータを返します。 - デフォルトでは、初期モックプロファイルにアクティブなサブスクリプションはありません。 - デフォルトでは、`makePurchase(...)`は購入成功をシミュレートし、プレミアムアクセスを付与します。 有効化時に`mockConfig`を使用してモックデータをカスタマイズできます。設定フォーマットとサポートされるパラメータは[こちら](https://react-native.adapty.io/interfaces/adaptymockconfig)でご確認ください。 ```typescript showLineNumbers title="App.tsx" try { await adapty.activate('YOUR_PUBLIC_SDK_KEY', { mockConfig: { // Customize the initial mock profile (optional) }, }); } catch (error) { console.error('Failed to activate Adapty SDK:', error); } ``` 有効化前にSDKメソッドを呼び出す必要がある場合（`isActivated()`や`setLogLevel()`など）は、`activate()`の前に`enableMock()`を使用してください。ブリッジがすでに初期化されている場合、このメソッドは何もしません。 ```typescript showLineNumbers title="App.tsx" adapty.enableMock(); // Optional: pass mockConfig to customize mock data // Now you can call methods before activation await adapty.activate('YOUR_PUBLIC_SDK_KEY'); ``` #### 開発目的でSDKの有効化を遅延させる \{#delay-sdk-activation-for-development-purposes\} AdaptyはSDK有効化時に必要なユーザーデータをすべて事前取得し、最新データへの高速アクセスを可能にします。 ただし、これはiOSシミュレーターで問題になる場合があります。iOSシミュレーターは開発中に頻繁に認証を求めることがあります。AdaptyはStoreKitの認証フローを制御できませんが、SDKが最新のユーザーデータを取得するためのリクエストを遅延させることができます。 `__debugDeferActivation`プロパティを有効にすると、次のAdapty SDKの呼び出しが行われるまでactivateの呼び出しが保留されます。これにより、認証データが不要な場合に不必要な認証プロンプトを防止できます。 **この機能は開発専用**であることに注意してください。すべての潜在的なユーザーシナリオをカバーするものではありません。本番環境では、実際のデバイスは通常認証データを記憶しており、繰り返し認証情報を求めることはないため、有効化を遅延させるべきではありません。 推奨される使用方法は以下の通りです： ```typescript showLineNumbers title="Typescript" try { adapty.activate('PUBLIC_SDK_KEY', { __debugDeferActivation: isSimulator(), // 'isSimulator' from any 3rd party library }); } catch (error) { console.error('Failed to activate Adapty SDK:', error); // Handle the error appropriately for your app } ``` #### React NativeのFast RefreshでのSDK有効化エラーのトラブルシューティング \{#troubleshoot-sdk-activation-errors-on-react-natives-fast-refresh\} React NativeでAdapty SDKを使って開発中に、次のエラーが発生することがあります：`Adapty can only be activated once. Ensure that the SDK activation call is not made more than once.` これは、React NativeのFast Refresh機能が開発中に複数回の有効化呼び出しをトリガーするために発生します。これを防ぐには、`__ignoreActivationOnFastRefresh`オプションを`__DEV__`（React Nativeの開発モードフラグ）に設定してください。 ```typescript showLineNumbers title="Typescript" try { adapty.activate('PUBLIC_SDK_KEY', { __ignoreActivationOnFastRefresh: __DEV__, }); } catch (error) { console.error('Failed to activate Adapty SDK:', error); // Handle the error appropriately for your app } ``` ## トラブルシューティング \{#troubleshooting\} #### iOSの最小バージョンエラー \{#minimum-ios-version-error\} iOSのビルド時に、**iOSの最小バージョン**またはデプロイメントターゲットに関するエラーが表示されることがあります。特に、**iOS 15.0以降**が必要な[Adapty ペイウォールビルダー](adapty-paywall-builder)で作成したペイウォールを使用する場合に発生します。 Expoは`expo prebuild`中にiOSプロジェクト（`Podfile`を含む）を生成するため、**`Podfile`を直接編集すべきではありません**。代わりに、`expo-build-properties`設定プラグインを使用してデプロイメントターゲットを設定してください。 1. プラグインをインストールします： ```sh npx expo install expo-build-properties ``` 2. Expo設定（`app.json`または`app.config.js`）を更新してiOSデプロイメントターゲットを設定します： ``` { "expo": { // ...other Expo config... "plugins": [ [ "expo-build-properties", { "ios": { // Use "13.0" for core Adapty features only, // or "15.0" if you use paywalls created in the paywall builder. "deploymentTarget": "15.0" } } ], ] } } ``` 3. ネイティブiOSプロジェクトを再生成してリビルドします： ``` npx expo prebuild --clean npx expo run:ios # or `eas build -p ios` on your CI ``` #### Android Auto Backupマニフェストの競合 \{#android-auto-backup-manifest-conflict\} ExpoでAndroid Auto Backupを設定する複数のSDK（Adapty、AppsFlyer、expo-secure-storeなど）を使用している場合、マニフェストマージの競合が発生することがあります。 典型的なエラーは次のようになります：`Manifest merger failed : Attribute application@fullBackupContent value=(@xml/secure_store_backup_rules) from AndroidManifest.xml:24:248-306 is also present at [io.adapty:android-sdk:3.12.0] AndroidManifest.xml:9:18-70 value=(@xml/adapty_backup_rules).` この競合を解決するには、AdaptyプラグインにAndroidバックアップ設定を管理させる必要があります。 プロジェクトで`expo-secure-store`も使用している場合は、重複を避けるためにそのバックアップ設定を無効にしてください。 `app.json`の設定方法は以下の通りです： ```json title="app.json" { "expo": { "plugins": [ ["react-native-adapty", { "replaceAndroidBackupConfig": true }], ["expo-secure-store", { "configureAndroidBackup": false }] ] } } ``` `replaceAndroidBackupConfig`オプションはデフォルトで`false`です。有効にすると、AdaptyプラグインがAndroidバックアップルールを管理します。 `expo-secure-store`を使用している場合は`"configureAndroidBackup": false`を含めて警告を防いでください。SecureStoreのバックアップ設定はAdaptyによって処理されます。 :::important この設定はAdapty、AppsFlyer、expo-secure-storeのバックアップ要件のみを対象としています。 プロジェクト内の他のライブラリがカスタムバックアップルールを定義している場合は、それらを手動で設定する必要があります。 ::: --- # File: sdk-installation-react-native-pure --- --- title: "純粋な React Native プロジェクトへの Adapty SDK のインストールと設定" description: "サブスクリプションアプリ向けに React Native で Adapty SDK をインストールするステップバイステップガイド。" --- :::important このガイドは**純粋な React Native（非 Expo）プロジェクト**にのみ適用されます。 **Expo** を使用している場合は、代わりに [Expo インストールガイド](sdk-installation-react-native-expo)に従ってください。 ::: Adapty SDK には、React Native アプリにシームレスに統合するための 2 つの主要モジュールが含まれています。 - **Core Adapty**: Adapty をアプリで正常に動作させるために必要なモジュールです。 - **AdaptyUI**: クロスプラットフォームのペイウォールを簡単に作成できるノーコードツール [Adapty Paywall Builder](adapty-paywall-builder) を使用する場合に必要なモジュールです。AdaptyUI はコアモジュールと同時に自動的に有効化されます。 :::tip Adapty SDK がモバイルアプリにどのように統合されているかの実例を見たいですか？ペイウォールの表示、購入、その他の基本機能を含む完全なセットアップを示す[サンプルアプリ](https://github.com/adaptyteam/AdaptySDK-React-Native/tree/master/examples)をご確認ください。 ::: ## 要件 \{#requirements\} Adapty React Native SDK は iOS 13.0 以降をサポートしていますが、[Adapty ペイウォールビルダー](adapty-paywall-builder)で作成したペイウォールを使用するには iOS 15.0 以降が必要です。 :::info SDK v3.17 以降、Adapty SDK はデフォルトで Google Play Billing Library v8.0.0 を使用します。 ::: --- no_index: true --- import Callout from '../../../components/Callout.astro'; SDKのインストールは、Adaptyセットアップのステップ5です。アプリ内で課金が機能するようにするには、アプリをストアに接続し、Adapty ダッシュボードでプロダクト、ペイウォール、プレースメントを作成する必要があります。[クイックスタートガイド](quickstart)では、必要なすべての手順を説明しています。 ## Adapty SDK のインストール \{#install-adapty-sdk\} [![Release](https://img.shields.io/github/v/release/adaptyteam/AdaptySDK-React-Native.svg?style=flat&logo=react)](https://github.com/adaptyteam/AdaptySDK-React-Native/releases) 1. Adapty SDK をインストールします（`@adapty/core` も自動的にインストールされます）: ```sh showLineNumbers title="Shell" # using npm npm install react-native-adapty # or using yarn yarn add react-native-adapty ``` 2. iOS の場合、pods をインストールします: ```sh showLineNumbers title="Shell" cd ios && pod install ```
Android で React Native のバージョンが 0.73.0 より古い場合（クリックして展開） `/android/build.gradle` ファイルを更新してください。`kotlin-gradle-plugin:1.8.0` 以降の依存関係があることを確認してください。 ```groovy showLineNumbers title="/android/build.gradle" ... buildscript { ... dependencies { ... classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:1.8.0" } } ... ```
## Adapty SDK の Adapty モジュールを有効化する \{#activate-adapty-module-of-adapty-sdk\} **Public SDK Key** を取得するには： 1. Adapty ダッシュボードを開き、[**App settings → General**](https://app.adapty.io/settings/general) に移動します。 2. **Api keys** セクションから **Public SDK Key**（Secret Key ではない方）をコピーします。 3. コード内の `"YOUR_PUBLIC_SDK_KEY"` を置き換えます。 :::important - Adapty の初期化には必ず **Public SDK key** を使用してください。**Secret key** は[サーバーサイド API](getting-started-with-server-side-api) 専用です。 - **SDK keys** はアプリごとに固有です。複数のアプリがある場合は、正しいキーを選択してください。 ::: Adapty を有効化するには、以下のコードを `App.tsx` にコピーしてください。 ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY'); ``` :::important 他の Adapty SDK メソッドを呼び出す前に、`activate` が完了するまで待機してください。完全なシーケンスについては、[React Native SDK の呼び出し順序](react-native-sdk-call-order)を参照してください。 ::: 次にアプリにペイウォールを設定します。 - [Adapty Paywall Builder](adapty-paywall-builder) を使用する場合は、[ペイウォールビルダーのクイックスタート](react-native-quickstart-paywalls)に従ってください。 - 独自のペイウォール UI を構築する場合は、[カスタムペイウォールのクイックスタート](react-native-quickstart-manual)を参照してください。 :::tip 開発環境での有効化エラーを回避するには、[ヒント](#development-environment-tips)を参照してください。 ::: ## Adapty SDK の AdaptyUI モジュールを有効化する \{#activate-adaptyui-module-of-adapty-sdk\} [ペイウォールビルダー](adapty-paywall-builder)を使用する予定がある場合は、AdaptyUI モジュールが必要です。コアモジュールを有効化すると自動的に有効化されるため、追加の操作は必要ありません。 ## オプションの設定 \{#optional-setup\} ### ロギング \{#logging\} #### ロギングシステムのセットアップ \{#set-up-the-logging-system\} Adapty はエラーやその他の重要な情報をログに記録し、状況を把握するのに役立てます。以下のログレベルが利用可能です。 | レベル | 説明 | | ---------- | ------------------------------------------------------------ | | `error` | エラーのみがログに記録されます | | `warn` | エラーと、致命的なエラーを引き起こさないものの注意が必要な SDK からのメッセージがログに記録されます | | `info` | エラー、警告、各種情報メッセージがログに記録されます | | `verbose` | 関数呼び出し、API クエリなど、デバッグに役立つ追加情報がログに記録されます | Adapty の設定前または設定中にアプリでログレベルを設定できます。 ```typescript showLineNumbers title="App.tsx" // Set log level before activation // 'verbose' is recommended for development and the first production release adapty.setLogLevel('verbose'); // Or set it during configuration adapty.activate('YOUR_PUBLIC_SDK_KEY', { logLevel: 'verbose', }); ``` ### データポリシー \{#data-policies\} Adapty は明示的に送信しない限りユーザーの個人データを保存しませんが、ストアや国のガイドラインに準拠するために追加のデータセキュリティポリシーを実装できます。 #### IP アドレスの収集と共有を無効にする \{#disable-ip-address-collection-and-sharing\} Adapty モジュールを有効化する際に、`ipAddressCollectionDisabled` を `true` に設定することで、ユーザーの IP アドレスの収集と共有を無効にできます。デフォルト値は `false` です。 このパラメーターは、ユーザープライバシーの強化、地域のデータ保護規制（GDPR や CCPA など）への準拠、または IP ベースの機能がアプリに必要ない場合の不要なデータ収集の削減に使用してください。 ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { ipAddressCollectionDisabled: true, }); ``` #### 広告 ID の収集と共有を無効にする \{#disable-advertising-id-collection-and-sharing\} Adapty モジュールを有効化する際に、`ios.idfaCollectionDisabled`（iOS）または `android.adIdCollectionDisabled`（Android）を `true` に設定することで、広告識別子の収集を無効にできます。デフォルト値は `false` です。 App Store/Play Store のポリシーに準拠する場合、App Tracking Transparency のプロンプトをトリガーしないようにする場合、またはアプリが広告 ID に基づくアトリビューションやアナリティクスを必要としない場合に、このパラメーターを使用してください。 ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { ios: { idfaCollectionDisabled: true, }, android: { adIdCollectionDisabled: true, }, }); ``` #### AdaptyUI のメディアキャッシュ設定をセットアップする \{#set-up-media-cache-configuration-for-adaptyui\} デフォルトでは、AdaptyUI はパフォーマンス向上とネットワーク使用量の削減のためにメディア（画像や動画など）をキャッシュします。カスタム設定を指定することでキャッシュ設定をカスタマイズできます。 `mediaCache` を使用してデフォルトのキャッシュ設定を上書きします。 ```typescript adapty.activate('YOUR_PUBLIC_SDK_KEY', { mediaCache: { memoryStorageTotalCostLimit: 200 * 1024 * 1024, // Optional: memory cache size in bytes memoryStorageCountLimit: 2147483647, // Optional: max number of items in memory diskStorageSizeLimit: 200 * 1024 * 1024, // Optional: disk cache size in bytes }, }); ``` パラメーター: | パラメーター | 必須 | 説明 | |-----------|----------|-------------| | memoryStorageTotalCostLimit | オプション | メモリ内のキャッシュの合計サイズ（バイト単位）。デフォルトはプラットフォーム固有の値です。 | | memoryStorageCountLimit | オプション | メモリストレージのアイテム数の上限。デフォルトはプラットフォーム固有の値です。 | | diskStorageSizeLimit | オプション | ディスク上のファイルサイズ制限（バイト単位）。デフォルトはプラットフォーム固有の値です。 | ### ローカルアクセスレベルを有効にする（Android） \{#enable-local-access-levels-android\} デフォルトでは、[ローカルアクセスレベル](local-access-levels)は iOS で有効、Android で無効になっています。Android でも有効にするには、`localAccessLevelAllowed` を `true` に設定します。 ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { android: { localAccessLevelAllowed: true, }, }); ``` ### バックアップ復元時のデータクリア \{#clear-data-on-backup-restore\} `clearDataOnBackup` を `true` に設定すると、SDK はアプリが iCloud バックアップから復元されたことを検出し、キャッシュされたプロファイル情報、プロダクト詳細、ペイウォールなど、ローカルに保存されているすべての SDK データを削除します。その後、SDK はクリーンな状態で初期化されます。デフォルト値は `false` です。 :::note 削除されるのはローカルの SDK キャッシュのみです。Apple とのトランザクション履歴および Adapty サーバー上のユーザーデータは変更されません。 ::: ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { ios: { clearDataOnBackup: true }, }); ``` ## 開発環境のヒント \{#development-environment-tips\} #### 開発目的で SDK の有効化を遅延させる \{#delay-sdk-activation-for-development-purposes\} Adapty は SDK 有効化時に必要なユーザーデータをすべて事前取得し、新鮮なデータへの迅速なアクセスを可能にします。 ただし、これは開発中に頻繁に認証を求める iOS シミュレーターで問題を引き起こす可能性があります。Adapty は StoreKit の認証フローを制御できませんが、新鮮なユーザーデータを取得するための SDK リクエストを遅延させることができます。 `__debugDeferActivation` プロパティを有効にすると、次の Adapty SDK 呼び出しが行われるまで activate 呼び出しが保留されます。これにより、認証データが不要な場合の不要な認証プロンプトを防止できます。 **この機能は開発専用**であり、すべての潜在的なユーザーシナリオをカバーするわけではないことに注意してください。本番環境では有効化を遅延させるべきではありません。実際のデバイスは通常、認証データを記憶しており、繰り返し認証情報を求めることはありません。 推奨される使用方法は以下のとおりです。 ```typescript showLineNumbers title="Typescript" try { adapty.activate('PUBLIC_SDK_KEY', { __debugDeferActivation: isSimulator(), // 'isSimulator' from any 3rd party library }); } catch (error) { console.error('Failed to activate Adapty SDK:', error); // Handle the error appropriately for your app } ``` #### React Native の Fast Refresh での SDK 有効化エラーのトラブルシューティング \{#troubleshoot-sdk-activation-errors-on-react-natives-fast-refresh\} React Native で Adapty SDK を使用して開発していると、次のエラーが発生する場合があります: `Adapty can only be activated once. Ensure that the SDK activation call is not made more than once.` これは、React Native の fast refresh 機能が開発中に複数の有効化呼び出しをトリガーするために発生します。これを防ぐには、`__ignoreActivationOnFastRefresh` オプションを `__DEV__`（React Native の開発モードフラグ）に設定します。 ```typescript showLineNumbers title="Typescript" try { adapty.activate('PUBLIC_SDK_KEY', { __ignoreActivationOnFastRefresh: __DEV__, }); } catch (error) { console.error('Failed to activate Adapty SDK:', error); // Handle the error appropriately for your app } ``` #### ローカルテスト用のモックモードをセットアップする \{#set-up-mock-mode-for-local-testing\} ローカルの開発およびテストでは、サンドボックスの App Store/Google Play アカウントを必要とせずにイテレーションを高速化するためにモックモードを有効にできます。モックモードは Adapty のネイティブモジュールを完全にバイパスし、シミュレートされたデータを返します。 :::important モックモードは実際の購入をテストするためのツールでは**ありません**。 - App Store / Google Play の購入フローを**開きません**。また、実際のトランザクションを**作成しません**。 - **Adapty Paywall Builder（AdaptyUI）**で作成したペイウォール/オンボーディングを**レンダリングしません**。 - Adapty のネイティブモジュールは**完全にバイパス**されます。Xcode/Android ビルドにネイティブ SDK ファイルがなくても、無効な API キーでもエラーは発生しません。 - Adapty のサーバーにデータは送信されません。 実際の購入とペイウォールビルダーのペイウォールをテストするには、モックモードを無効にしてサンドボックスアカウントを使用してください。 ::: モックモードを有効にするには、`enableMock` を `true` に設定します。 ```typescript showLineNumbers title="App.tsx" adapty.activate('YOUR_PUBLIC_SDK_KEY', { enableMock: true, }); ``` モックモードが有効な場合: - すべての Adapty メソッドは、Adapty のサーバーへのネットワークリクエストを行わずにモックデータを返します。 - デフォルトでは、初期モックプロファイルにはアクティブなサブスクリプションがありません。 - デフォルトでは、`makePurchase(...)` は成功した購入をシミュレートし、プレミアムアクセスを付与します。 有効化時に `mockConfig` を使用してモックデータをカスタマイズできます。設定フォーマットとサポートされているパラメーターは[こちら](https://react-native.adapty.io/interfaces/adaptymockconfig)を参照してください。 ```typescript showLineNumbers title="App.tsx" try { await adapty.activate('YOUR_PUBLIC_SDK_KEY', { mockConfig: { // Customize the initial mock profile (optional) }, }); } catch (error) { console.error('Failed to activate Adapty SDK:', error); } ``` 有効化前に SDK メソッドを呼び出す必要がある場合（`isActivated()` や `setLogLevel()` など）、`activate()` の前に `enableMock()` を使用します。ブリッジがすでに初期化されている場合、このメソッドは何もしません。 ```typescript showLineNumbers title="App.tsx" adapty.enableMock(); // Optional: pass mockConfig to customize mock data // Now you can call methods before activation await adapty.activate('YOUR_PUBLIC_SDK_KEY'); ``` ## トラブルシューティング \{#troubleshooting\} #### iOS の最小バージョンエラー \{#minimum-ios-version-error\} iOS の最小バージョンエラーが発生した場合は、Podfile を更新してください。 ```diff -platform :ios, min_ios_version_supported +platform :ios, '13.0' # For core features only # OR +platform :ios, '15.0' # If using paywalls created in the paywall builder ``` #### Android Auto Backup マニフェストの競合 \{#android-auto-backup-manifest-conflict\} 一部のSDK（Adaptyを含む）には、独自のAndroid Auto Backup設定が含まれています。バックアップルールを定義する複数のSDKを使用している場合、Androidのマニフェストマージャーが `android:fullBackupContent`、`android:dataExtractionRules`、または `android:allowBackup` に関するエラーで失敗することがあります。 よくあるエラーの症状: `Manifest merger failed: Attribute application@dataExtractionRules value=(@xml/your_data_extraction_rules) is also present at [com.other.sdk:library:1.0.0] value=(@xml/other_sdk_data_extraction_rules)` :::note これらの変更は、Androidプラットフォームのディレクトリ（通常はプロジェクトの `android/` フォルダー内）で行う必要があります。 ::: この問題を解決するには、以下が必要です： - バックアップ関連の属性に対して、アプリの値を使用するようマニフェストマージャーに指示する。 - AdaptyのルールとほかのSDKのルールをマージしたバックアップルールファイルを作成する。 #### 1. マニフェストに `tools` 名前空間を追加する \{#1-add-the-tools-namespace-to-your-manifest\} `AndroidManifest.xml` ファイルのルートの `` タグに tools が含まれていることを確認してください： ```xml ... ``` #### 2. `` でバックアップ属性を上書きする \{#2-override-backup-attributes-in-application\} 同じ `AndroidManifest.xml` ファイルで、`` タグを更新して、アプリが最終的な値を提供し、マニフェストマージャーにライブラリの値を置き換えるよう指示します： ```xml ... ``` いずれかのSDKが `android:allowBackup` も設定している場合は、`tools:replace` に含めてください： ```xml tools:replace="android:allowBackup,android:fullBackupContent,android:dataExtractionRules" ``` #### 3. マージしたバックアップルールファイルを作成する \{#3-create-merged-backup-rules-files\} AndroidプロジェクトのAdaptyのルールとほかのSDKのルールを組み合わせた `res/xml/` ディレクトリにXMLファイルを作成します。AndroidはOSのバージョンによって異なるバックアップルール形式を使用するため、両方のファイルを作成することで、アプリがサポートするすべてのAndroidバージョンとの互換性が確保されます。 :::note 以下の例では、サンプルのサードパーティSDKとしてAppsFlyerを使用しています。アプリで使用しているほかのSDKのルールに置き換えるか、追加してください。 ::: **Android 12以降**（新しいデータ抽出ルール形式を使用）： ```xml title="sample_data_extraction_rules.xml" ``` **Android 11以前**（従来のフルバックアップコンテンツ形式を使用）： ```xml title="sample_backup_rules.xml" #### Android で別のアプリから戻った後に購入が失敗する \{#purchases-fail-after-returning-from-another-app-in-android\} 購入フローを開始する Activity がデフォルト以外の `launchMode` を使用している場合、Google Play、銀行アプリ、またはブラウザからユーザーが戻ったときに Android が Activity を誤って再作成または再利用することがあります。これにより、購入結果が失われたり、キャンセルとして処理されたりする可能性があります。 購入が正しく機能するようにするには、購入フローを開始する Activity に `standard` または `singleTop` の起動モードのみを使用し、その他のモードを避けてください。 `AndroidManifest.xml` で、購入フローを開始する Activity が `standard` または `singleTop` に設定されていることを確認してください。 ```xml ``` #### Podfile の SWIFT_VERSION オーバーライドによる Swift 6 ビルドエラー \{#swift-6-build-errors-caused-by-podfile-swift_version-override\} iOS 向けに React Native アプリをビルドすると、Adapty pod ターゲットで Swift 6 のコンパイルエラーが表示される場合があります。典型的な症状としては、`AdaptyUIBuilderLogic` での `@Sendable` の不一致、Adapty 型での `Sendable` 適合の欠如、またはアクター分離エラーがあります。 Adapty pod は `s.swift_version = '6.0'` を宣言しており、Swift 6 でビルドする必要があります。アプリ自体のコードは Swift 5 のままで問題ありません。Adapty pod ターゲット（`Adapty`、`AdaptyUI`、`AdaptyUIBuilder`、`AdaptyLogger`、`AdaptyPlugin`）のみが Swift 6 でビルドされる必要があります。 最も一般的な原因は、すべての pod ターゲットに対して `SWIFT_VERSION` を書き換える `ios/Podfile` の `post_install` フックです。 ```ruby showLineNumbers title="ios/Podfile" post_install do |installer| installer.pods_project.targets.each do |target| target.build_configurations.each do |config| config.build_settings['SWIFT_VERSION'] = '5.9' end end end ``` **修正方法**: Adapty pod ターゲットをオーバーライドから除外します。 ```ruby showLineNumbers title="ios/Podfile" post_install do |installer| installer.pods_project.targets.each do |target| next if %w[Adapty AdaptyUI AdaptyUIBuilder AdaptyLogger AdaptyPlugin].include?(target.name) target.build_configurations.each do |config| config.build_settings['SWIFT_VERSION'] = '5.9' end end end ``` 次に `ios/` ディレクトリから `pod install` を実行し、再ビルドしてください。 確認するには、`ios/Pods/Pods.xcodeproj` を開き、`Adapty` pod ターゲット → **Build Settings** → **Swift Language Version** を選択してください。**Swift 6** になっているはずです。 --- # File: react-native-quickstart-paywalls --- --- title: "React Native SDKでペイウォールを使ってアプリ内課金を有効にする" description: "Adapty SDKを使ってReact NativeアプリでペイウォールをPresentする方法を学びましょう。" --- アプリ内課金を有効にするには、3つの重要な概念を理解する必要があります。 - [**プロダクト**](product) – ユーザーが購入できるもの（サブスクリプション、消耗型アイテム、永続アクセスなど） - [**ペイウォール**](paywalls) – 提供するプロダクトを定義する設定です。Adaptyでは、プロダクトを取得する唯一の方法がペイウォールですが、この設計によりアプリのコードを変更せずに、提供内容・価格・プロダクトの組み合わせを変更できます。 - [**プレースメント**](placements) – アプリ内でペイウォールを表示する場所とタイミング（`main`、`onboarding`、`settings` など）。ダッシュボードでプレースメントにペイウォールを設定し、コードではプレースメントIDを使って取得します。これにより、A/B テストの実施や、ユーザーごとに異なるペイウォールの表示が簡単にできます。 Adaptyでは、アプリ内課金を有効にする方法を3つ提供しています。アプリの要件に応じて選択してください。 | 実装方法 | 複雑さ | 使用ケース | |-------------------------------|------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | Adapty ペイウォールビルダー | ✅ 簡単 | [ノーコードビルダーで完全な購入対応ペイウォールを作成](quickstart-paywalls)します。Adaptyが自動でレンダリングし、複雑な購入フロー・レシート検証・サブスクリプション管理をすべて裏側で処理します。 | | 手動作成のペイウォール | 🟡 中程度 | ペイウォールのUIはアプリのコードで実装しますが、プロダクト提供の柔軟性を維持するためにAdaptyからペイウォールオブジェクトを取得します。[ガイド](react-native-quickstart-manual)を参照してください。 | | オブザーバーモード | 🔴 難しい | 独自の購入処理インフラがすでにあり、それを引き続き使いたい場合。オブザーバーモードにはAdaptyでの制限があります。[記事](observer-vs-full-mode)を参照してください。 | :::important **以下の手順は、Adaptyペイウォールビルダーで作成したペイウォールの実装方法を示しています。** ペイウォールビルダーを使用しない場合は、[手動作成ペイウォールでの購入処理ガイド](react-native-making-purchases)を参照してください。 ::: Adaptyペイウォールビルダーで作成したペイウォールを表示するには、アプリのコードで以下の手順を実施するだけです。 1. **ペイウォールを取得する**: AdaptyからペイウォールオブジェクトをGetします。 2. **ペイウォールを表示してAdaptyに購入を処理させる**: 取得したペイウォールコンテナをアプリに表示します。 3. **ボタン操作を処理する**: ペイウォール上のユーザー操作とアプリの応答を関連付けます。例えば、ユーザーがボタンをクリックしたときにリンクを開いたりペイウォールを閉じたりします。 ## 始める前に \{#before-you-start\} 始める前に、以下の手順を完了してください。 1. Adapty ダッシュボードで[App Store](initial_ios)および/または[Google Play](initial-android)にアプリを接続します。 2. Adaptyで[プロダクトを作成](create-product)します。 3. [ペイウォールを作成してプロダクトを追加](create-paywall)します。 4. [プレースメントを作成してペイウォールを追加](create-placement)します。 5. アプリコードに[Adapty SDKをインストールして有効化](sdk-installation-reactnative)します。 :::tip これらの手順を最速で完了するには、[クイックスタートガイド](quickstart)に従うか、[Developer CLI](developer-cli-quickstart)を使ってペイウォールとプレースメントを作成してください。 ::: ## 1. ペイウォールを取得する \{#1-get-the-paywall\} ペイウォールは、ダッシュボードで設定したプレースメントに関連付けられています。プレースメントを使うと、異なるオーディエンスに別々のペイウォールを表示したり、[A/B テスト](ab-tests)を実施したりできます。 Adaptyペイウォールビルダーで作成したペイウォールを取得するには、以下の手順を実施します。 1. `getPaywall`メソッドを使って[プレースメント](placements)IDで`paywall`オブジェクトを取得し、`hasViewConfiguration`プロパティでビルダーで作成したペイウォールかどうかを確認します。 2. `createPaywallView`メソッドを使ってペイウォールビューを作成します。このビューには、ペイウォールを表示するためのUI要素とスタイリングが含まれています。 :::important ビュー設定を取得するには、ペイウォールビルダーで **Show on device** トグルをオンにする必要があります。オフの場合、空のビュー設定が返され、ペイウォールが表示されません。 ::: ```typescript showLineNumbers title="React Native" try { const placementId = 'YOUR_PLACEMENT_ID'; const paywall = await adapty.getPaywall(placementId); // the requested paywall } catch (error) { // handle the error } if (paywall.hasViewConfiguration) { try { const view = await createPaywallView(paywall); } catch (error) { // handle the error } } else { //use your custom logic } ``` ## 2. ペイウォールを表示する \{#2-display-the-paywall\} ペイウォールの設定を取得したら、数行のコードを追加するだけでペイウォールを表示できます。 既存のコンポーネントツリーにペイウォールを埋め込むには、React Nativeコンポーネント階層に`AdaptyPaywallView`コンポーネントを直接使用します。 ```typescript showLineNumbers title="React Native (TSX)" function MyPaywall({ paywall }) { const onCloseButtonPress = useCallback(() => {}, []); const onUrlPress = useCallback((url) => { Linking.openURL(url); }, []); return ( ); } ``` ペイウォールをスタンドアロンスクリーンとして表示するには、`createPaywallView`メソッドで作成した`view`の`view.present()`メソッドを使用します。各`view`は一度しか使用できません。再度ペイウォールを表示する必要がある場合は、`createPaywallView`をもう一度呼び出して新しい`view`インスタンスを作成してください。 ```typescript showLineNumbers title="React Native" try { await view.present(); } catch (error) { // handle the error } ``` :::tip ペイウォールの表示方法の詳細については、[ガイド](react-native-present-paywalls)を参照してください。 ::: ## 3. ボタン操作を処理する \{#3-handle-button-actions\} ユーザーがペイウォール内のボタンをクリックすると、React Native SDKは購入・リストア・ペイウォールのクローズ・URLのオープンを自動で処理します。 ただし、カスタムまたは事前定義済みのIDを持つボタンについては、アプリのコードでアクションを処理する必要があります。また、デフォルトの動作をオーバーライドしたい場合もあります。 例えば、以下はクローズボタンのデフォルト動作です。コードに追加する必要はありませんが、必要な場合の実装方法を確認できます。 Reactコンポーネントの場合、`AdaptyPaywallView`コンポーネント内でアクションを直接処理します。 ```typescript showLineNumbers title="React Native (TSX)" function MyPaywall({ paywall }) { const onUrlPress = useCallback((url) => { Linking.openURL(url); }, []); const onCloseButtonPress = useCallback(() => {}, []); const onCustomAction = useCallback((actionId) => {}, []); return ( ); } ``` モーダル表示の場合、`setEventHandlers`を使ってイベントハンドラーを実装します。 ```typescript showLineNumbers title="React Native" const unsubscribe = view.setEventHandlers({ onCloseButtonPress() { return true; // allow paywall closing } }); ``` :::tip ボタンの[アクション](react-native-handle-paywall-actions)と[イベント](react-native-handling-events-1)の処理方法については、各ガイドを参照してください。 ::: ## 次のステップ \{#next-steps\} --- no_index: true --- import Callout from '../../../components/Callout.astro'; ご質問やお困りのことがあれば、[サポートフォーラム](https://adapty.featurebase.app/)をご覧ください。よくある質問への回答を見つけたり、ご自身の質問を投稿することができます。チームとコミュニティがサポートいたします！ これでアプリにペイウォールを表示する準備が整いました。[App Store サンドボックス](test-purchases-in-sandbox)または[Google Play Store](testing-on-android)でテスト購入を行い、ペイウォールからテスト購入を完了できることを確認してください。 次に、適切なユーザーにペイウォールを表示したり有料機能へのアクセスを付与したりするために、[ユーザーのアクセスレベルを確認](react-native-check-subscription-status)する必要があります。 ## 完全なサンプル \{#full-example\} すべての手順をアプリに統合した例を以下に示します。 ```javascript showLineNumbers title="React Native (TSX)" export default function PaywallScreen() { const [paywall, setPaywall] = useState(null); const loadPaywall = async () => { try { const paywallData = await adapty.getPaywall('YOUR_PLACEMENT_ID'); if (paywallData.hasViewConfiguration) { setPaywall(paywallData); } } catch (error) { console.warn('Error loading paywall:', error); } }; const onUrlPress = useCallback((url) => { Linking.openURL(url); }, []); const onCloseButtonPress = useCallback(() => { // Handle close button press }, []); useEffect(() => { loadPaywall(); }, []); return ( {paywall ? ( ) : (