React Native SDKでリモートコンフィグによるペイウォールをレンダリングする
リモートコンフィグを使ってペイウォールをカスタマイズした場合、ユーザーに表示するためのレンダリング処理をモバイルアプリのコードに実装する必要があります。リモートコンフィグはニーズに合わせた柔軟性を提供するため、ペイウォールに何を含めるか、またどのように表示するかはあなた次第です。リモートコンフィグから取得したカスタムペイウォールを表示できるよう、リモートコンフィグを取得するメソッドを提供しています。
ペイウォールのリモートコンフィグを取得して表示する
ペイウォールのリモートコンフィグを取得するには、remoteConfig プロパティにアクセスして必要な値を取り出します。
try {
const paywall = await adapty.getPaywall({ placementId: "YOUR_PLACEMENT_ID" });
const headerText = paywall.remoteConfig?.data?.["header_text"];
} catch (error) {
// handle the error
}
必要な値をすべて取得したら、それらをレンダリングして見栄えの良いページに組み立てましょう。さまざまなスマートフォンの画面サイズや向きに対応したデザインにすることで、デバイスを問わずシームレスで使いやすい体験を提供できます。
AdaptyアナリティクスがファネルやみA/B テストのデータを正確に収集できるよう、以下で説明するペイウォール表示イベントの記録を必ず行ってください。
ペイウォールの表示が完了したら、購入フローの設定に進みます。ユーザーが購入を行う際は、ペイウォールのプロダクトを使って .makePurchase() を呼び出すだけです。.makePurchase() メソッドの詳細については、購入の実装をご覧ください。
インターネット接続がない場合やキャッシュが利用できない場合でもスムーズな体験を確保するため、フォールバックペイウォールの作成をおすすめします。
ペイウォール表示イベントを記録する
Adaptyはペイウォールのパフォーマンス測定をサポートしています。購入データは自動的に収集されますが、ペイウォールの表示ログはお客様側で記録する必要があります。ペイウォールをいつ表示するかを把握しているのはあなただけだからです。
ペイウォール表示イベントをログに記録するには、.logShowPaywall(paywall) を呼び出すだけです。これにより、ファネルやA/B テストのペイウォール指標に反映されます。
ペイウォールビルダーで作成したペイウォールを表示する場合、.logShowPaywall(paywall) の呼び出しは不要です。
await adapty.logShowPaywall(paywall);
リクエストパラメータ:
| パラメータ | 必須 | 説明 |
|---|---|---|
| paywall | 必須 | AdaptyPaywall オブジェクト。 |