ÿÿ Triển khai Web Paywall | Capacitor SDK | Tài liệu Adapty

Triển khai web paywall

Trước khi bắt đầu, hãy đảm bảo bạn đã cấu hình web paywall trong dashboard và đã cài đặt Adapty SDK phiên bản 3.6.1 trở lên.

Mở web paywall

Nếu bạn đang làm việc với paywall tự phát triển, bạn cần xử lý web paywall bằng phương thức SDK. Phương thức .openWebPaywall:

  1. Tạo má»™t URL duy nhất cho phép Adapty liên kết paywall cụ thể Ä‘ang hiển thị vá»›i má»™t ngưá»i dùng cụ thể đến trang web mà hỠđược chuyển hướng đến.
  2. Theo dõi khi ngưá»i dùng quay lại ứng dụng, sau đó gá»i .getProfile theo các khoảng thá»i gian ngắn để xác định xem quyá»n truy cập trong hồ sÆ¡ ngưá»i dùng có được cập nhật hay không. Bằng cách này, nếu thanh toán thành công và quyá»n truy cập được cập nhật, gói đăng ký sẽ kích hoạt trong ứng dụng gần như ngay lập tức.

try {
  await adapty.openWebPaywall({ paywallOrProduct: product });
} catch (error) {
  console.error('Failed to open web paywall:', error);
}

Có hai phiên bản của phương thức openWebPaywall:

  1. openWebPaywall({ paywallOrProduct: product }) tạo URL theo paywall và thêm dữ liệu sản phẩm vào URL.
  2. openWebPaywall({ paywallOrProduct: paywall }) tạo URL theo paywall mà không thêm dữ liệu sản phẩm vào URL. Dùng phiên bản này khi các sản phẩm trong paywall Adapty cá»§a bạn khác vá»›i các sản phẩm trong web paywall. Trong SDK v4, phía paywall cá»§a paywallOrProduct nhận má»™t AdaptyFlowPaywall — má»™t biến thể paywall cá»§a flow đã tải vá». Hãy kiểm tra flow.paywalls không rá»—ng trước khi truy cập vào nó, ví dụ flow.paywalls[0].

Xử lý lỗi

LỗiMô tảHành động khuyến nghị
AdaptyError.paywallWithoutPurchaseUrlPaywall chưa được cấu hình URL mua hàng qua webKiểm tra xem paywall đã được cấu hình đúng trong Adapty Dashboard chưa
AdaptyError.productWithoutPurchaseUrlSản phẩm chưa có URL mua hàng qua webXác minh cấu hình sản phẩm trong Adapty Dashboard
AdaptyError.failedOpeningWebPaywallUrlKhông thể mở URL trong trình duyệtKiểm tra cài đặt thiết bị hoặc cung cấp phương thức mua hàng thay thế
AdaptyError.failedDecodingWebPaywallUrlKhông thể mã hóa đúng các tham số trong URLXác minh rằng các tham số URL hợp lệ và được định dạng đúng

Lấy URL web paywall mà không cần mở nó

Nếu bạn muốn tự hiển thị trang mua hàng trên web thay vì để SDK mở nó, hãy dùng createWebPaywallUrl. Hàm này trả vỠcùng một URL duy nhất mà openWebPaywall sẽ mở, vì vậy bạn có thể render nó trong web view của riêng mình hoặc xử lý redirect theo cách bạn muốn. Hàm này nhận cùng tham số paywallOrProduct — một biến thể paywall của flow đã fetch (AdaptyFlowPaywall) hoặc một AdaptyPaywallProduct.


try {
  const url = await adapty.createWebPaywallUrl({ paywallOrProduct: product });
  // open `url` in your own web view, or handle the redirect yourself
} catch (error) {
  console.error('Failed to create web paywall URL:', error);
}

Äể mở má»™t URL tùy ý (không phải web paywall) qua trình duyệt native — ví dụ từ nút bấm trong flow — hãy dùng adapty.openWebUrl thay thế.

Mở web paywall trong trình duyệt trong ứng dụng

Mở web paywall trong trình duyệt trong ứng dụng được hỗ trợ từ Adapty SDK v3.15 trở lên.

Theo mặc định, web paywall sẽ mở trong trình duyệt bên ngoài.

Äể mang lại trải nghiệm liá»n mạch cho ngưá»i dùng, bạn có thể mở web paywall trong trình duyệt tích hợp trong ứng dụng. Äiá»u này hiển thị trang mua hàng ngay bên trong ứng dụng cá»§a bạn, cho phép ngưá»i dùng hoàn tất giao dịch mà không cần chuyển sang ứng dụng khác.

Äể bật tính năng này, đặt openIn thành WebPresentation.BrowserInApp trong openWebPaywall:


try {
    await adapty.openWebPaywall({
        paywallOrProduct: product,
        openIn: WebPresentation.BrowserInApp, // default – WebPresentation.BrowserOutApp
    });
} catch (error) {
    console.error('Failed to open web paywall:', error);
}
ÿÿÿÿ