---
title: "Implement web paywalls"
description: "Tìm hiểu cách triển khai web paywalls trong ứng dụng Capacitor của bạn với Adapty SDK."
---

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

## Mở web paywalls \{#open-web-paywalls\}

Nếu bạn đang làm việc với paywall tự phát triển, bạn cần xử lý web paywalls 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 một paywall cụ thể được hiển thị cho một người dùng nhất định với trang web họ được chuyển hướng đến.
2. Theo dõi khi người dùng quay lại ứng dụng rồi gọi `.getProfile` theo các khoảng thời gian ngắn để xác định xem quyền truy cập của hồ sơ người dùng có được cập nhật hay không.

Nhờ vậ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.

```typescript showLineNumbers

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

:::note
Có hai phiên bản của phương thức `openWebPaywall`:
1. `openWebPaywall({ paywallOrProduct: product })` tạo URL theo paywall và cũng 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 khi các sản phẩm trong Adapty paywall khác với các sản phẩm trong web paywall.
:::

#### Xử lý lỗi \{#handle-errors\}

| Lỗi                                     | Mô tả                                                         | Hành động khuyến nghị                                                                |
|-----------------------------------------|---------------------------------------------------------------|--------------------------------------------------------------------------------------|
| AdaptyError.paywallWithoutPurchaseUrl   | Paywall chưa được cấu hình URL mua hàng trên web             | Kiểm tra xem paywall đã được cấu hình đúng trong Adapty Dashboard chưa              |
| AdaptyError.productWithoutPurchaseUrl   | Sản phẩm chưa có URL mua hàng trên web                       | Xác minh cấu hình sản phẩm trong Adapty Dashboard                                   |
| AdaptyError.failedOpeningWebPaywallUrl  | Không thể mở URL trên trình duyệt                            | Kiểm tra cài đặt thiết bị hoặc cung cấp phương thức mua hàng thay thế               |
| AdaptyError.failedDecodingWebPaywallUrl | Không thể mã hóa các tham số trong URL đúng cách             | Xác minh các tham số URL hợp lệ và được định dạng đúng                              |

## Mở web paywalls trong trình duyệt trong ứng dụng \{#open-web-paywalls-in-an-in-app-browser\}

:::important
Mở web paywalls trong trình duyệt trong ứng dụng được hỗ trợ bắt đầu từ Adapty SDK v3.15.
:::

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

Để mang lại trải nghiệm người dùng liền mạch, bạn có thể mở web paywalls trong trình duyệt ngay trong ứng dụng. Điều này hiển thị trang mua hàng trên web ngay 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`:

```typescript showLineNumbers

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