ÿÿ Hiển thị paywall nhắm mục tiêu AA ngay khi khởi chạy lần đầu | React Native SDK | Tài liệu Adapty

Hiển thị paywall nhắm mục tiêu AA ngay khi khởi chạy lần đầu trong React Native SDK

Attribution cá»§a Apple Ads (AA) được nhận không đồng bá»™ sau khi adapty.activate() được gá»i. Ở lần khởi chạy đầu tiên, attribution thưá»ng chưa có, nên getPaywall sẽ giải quyết theo đối tượng mặc định và ngưá»i dùng Apple Ads sẽ bá» lỡ paywall được phân khúc theo AA cá»§a bạn. Thay vì chá» attribution đến má»›i hiển thị paywall, hãy hiển thị paywall ngay lập tức và làm má»›i khi attribution AA được áp dụng — để ngưá»i dùng Apple Ads nhận được biến thể nhắm mục tiêu còn những ngưá»i khác thấy paywall ngay không cần chá». AdaptyProfile.appliedAttributionSources cho bạn biết khi nào attribution AA đã được áp dụng.

Trước khi bắt đầu

Bạn cần:

  • Adapty React Native SDK phiên bản 3.17.1 trở lên.
  • Apple Ads đã được cấu hình cho ứng dụng trong Adapty. Xem Apple Ads.

Cách hoạt động

Sau khi adapty.activate() được gá»i, SDK sẽ yêu cầu attribution Apple Ads từ Apple ở chế độ ná»n và chuyển kết quả đến backend cá»§a Adapty. Khi AA trở thành nguồn attribution Ä‘ang hoạt động cho hồ sÆ¡ ngưá»i dùng, SDK sẽ gá»­i má»™t AdaptyProfile được cập nhật đến listener onLatestProfileLoad cá»§a bạn, vá»›i 'apple_search_ads' trong mảng appliedAttributionSources.

Äiá»u này cho phép bạn tải paywall theo hai bước:

  1. Gá»i getPaywall ngay lập tức. Khi chưa có attribution nào được áp dụng, Adapty sẽ giải quyết yêu cầu theo đối tượng mặc định, ngưá»i dùng thấy paywall ngay.
  2. Khi 'apple_search_ads' xuất hiện, gá»i lại getPaywall. Lúc này Adapty giải quyết yêu cầu theo đối tượng Apple Ads và trả vá» paywall nhắm mục tiêu, thay thế paywall đầu tiên.

appliedAttributionSources có thể rá»—ng hoặc không có giá trị. Äiá»u đó có nghÄ©a là:

  • Attribution Apple Ads chưa được xá»­ lý cho hồ sÆ¡ ngưá»i dùng này, hoặc
  • Chưa có attribution nào đến.

Dù thế nào, bước 1 vẫn an toàn — Adapty giải quyết yêu cầu theo đối tượng phù hợp vá»›i trạng thái hồ sÆ¡ ngưá»i dùng hiện tại, thưá»ng là đối tượng mặc định. Bước 2 chỉ chạy khi 'apple_search_ads' xuất hiện.

Ở má»—i lần khởi chạy tiếp theo, hồ sÆ¡ ngưá»i dùng đã được cache sẵn vá»›i 'apple_search_ads' trong appliedAttributionSources, nên lần getPaywall đầu tiên đã trả vá» paywall được phân khúc theo Apple Ads — không có lần tải thứ hai hay thay đổi nào hiển thị. Luồng hai bước chỉ quan trá»ng ở lần khởi chạy đầu tiên, khi attribution vẫn Ä‘ang trong quá trình xá»­ lý.

Triển khai

Hiển thị paywall ngay lập tức, sau đó lắng nghe 'apple_search_ads' và làm mới paywall khi nó xuất hiện.

  1. Kích hoạt SDK. Xem Cài đặt & cấu hình React Native SDK.
  2. Tải và hiển thị paywall bằng getPaywall như bình thưá»ng — không chặn chá» attribution.
  3. Äăng ký nhận cập nhật hồ sÆ¡ ngưá»i dùng bằng adapty.addEventListener('onLatestProfileLoad', …) và theo dõi 'apple_search_ads'. Khi nó xuất hiện, tải lại paywall và hiển thị paywall má»›i. Nếu bạn chưa thiết lập listener, xem Lắng nghe cập nhật gói đăng ký:
const subscription = adapty.addEventListener('onLatestProfileLoad', async profile => {
  if (!profile.appliedAttributionSources?.includes('apple_search_ads')) return;
  const targeted = await adapty.getPaywall(placementId);
  // present the targeted paywall in place of the first one
});

// Call subscription.remove() after the upgrade, or after a timeout (see below).
  1. Dừng lắng nghe sau má»™t khoảng thá»i gian. Hầu hết ngưá»i dùng không bao giá» nhận được attribution Apple Ads, vì vậy hãy xóa listener sau má»™t khoảng thá»i gian thay vì giữ nó mở suốt phiên. Cấu hình paywall dá»± phòng cho placement để ngưá»i dùng luôn thấy gì đó nếu yêu cầu thất bại.

Ví dụ hoàn chỉnh

onAppleAdsAttribution sẽ resolve khi attribution Apple Ads được áp dụng, hoặc reject sau timeoutMs. Äoạn code bên dưới tải paywall ngay lập tức, sau đó tải lại khi attribution đến — ngưá»i dùng Apple Ads nhận được paywall nhắm mục tiêu, và nếu attribution không bao giỠđến thì paywall đầu tiên vẫn được giữ nguyên:


const APPLE_ADS_SOURCE = 'apple_search_ads';
const placementId = 'YOUR_PLACEMENT_ID';

function hasAppleAdsAttribution(profile: AdaptyProfile): boolean {
  return profile.appliedAttributionSources?.includes(APPLE_ADS_SOURCE) ?? false;
}

/**
 * Resolves once Apple Ads attribution is applied to the profile.
 * Rejects with a timeout error if attribution never arrives within `timeoutMs`.
 * Call after `adapty.activate()`.
 */
export function onAppleAdsAttribution(timeoutMs: number): Promise<void> {
  return new Promise((resolve, reject) => {
    let timer: ReturnType<typeof setTimeout> | undefined;
    let subscription: { remove: () => void } | undefined;

    const stop = () => {
      clearTimeout(timer);
      subscription?.remove();
    };

    subscription = adapty.addEventListener('onLatestProfileLoad', profile => {
      if (!hasAppleAdsAttribution(profile)) return;
      stop();
      resolve();
    });

    timer = setTimeout(() => {
      stop();
      reject(new Error(`Apple Ads attribution timed out after ${timeoutMs}ms`));
    }, timeoutMs);
  });
}

let paywall = await adapty.getPaywall(placementId);

onAppleAdsAttribution(30_000)
  .then(() => adapty.getPaywall(placementId))
  .then(updated => {
    paywall = updated;
  })
  .catch(() => {
    console.log('Apple Ads attribution or loading failed');
  });

Ở lần khởi chạy đầu tiên, ngưá»i dùng Apple Ads sẽ thấy paywall mặc định trong má»™t khoảnh khắc trước khi nó được thay thế. Nếu bạn hiển thị paywall bằng Paywall Builder, hãy cân nhắc xem việc hiển thị lại có phù hợp không, hoặc chỉ áp dụng bản cập nhật trước khi paywall được hiển thị. Äiá»u chỉnh timeoutMs tùy theo thá»i gian bạn sẵn sàng lắng nghe — attribution khi đến thưá»ng xuất hiện trong vài giây sau khi khởi chạy.

Nếu ứng dụng cá»§a bạn đã lắng nghe onLatestProfileLoad cho các mục đích khác (ví dụ, kiểm tra trạng thái gói đăng ký), bạn không cần thay đổi gì. adapty.addEventListener há»— trợ nhiá»u listener độc lập, nên listener này sẽ được thêm vào mà không ảnh hưởng đến các listener khác.

ÿÿÿÿ