PaymentRequestEvent

Khả dụng hạn chế

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

Note: This feature is only available in Service Workers.

Giao diện PaymentRequestEvent của Web-based Payment Handler API là đối tượng được truyền cho trình xử lý thanh toán khi một PaymentRequest được thực hiện.

Hàm khởi tạo

PaymentRequestEvent() Thử nghiệm: Tạo một thể hiện đối tượng PaymentRequestEvent mới.

Thuộc tính phiên bản

methodData Read only Thử nghiệm: Trả về một mảng đối tượng chứa các định danh phương thức thanh toán cho các phương thức thanh toán mà trang web chấp nhận và bất kỳ dữ liệu đặc thù của phương thức thanh toán liên quan.
modifiers Read only Thử nghiệm: Trả về một mảng đối tượng chứa các thay đổi đối với chi tiết thanh toán.
paymentRequestId Read only Thử nghiệm: Trả về ID của đối tượng PaymentRequest.
paymentRequestOrigin Read only Thử nghiệm: Trả về nguồn gốc nơi đối tượng PaymentRequest được khởi tạo.
topOrigin Read only Thử nghiệm: Trả về nguồn gốc cấp cao nhất nơi đối tượng PaymentRequest được khởi tạo.
total Read only Thử nghiệm: Trả về tổng số tiền được yêu cầu để thanh toán.

Phương thức phiên bản

changePaymentMethod() Thử nghiệm: Lấy tổng số tiền đã cập nhật, dựa trên chi tiết phương thức thanh toán.
openWindow() Thử nghiệm: Mở URL được chỉ định trong một cửa sổ mới, chỉ khi URL đã cho cùng nguồn gốc với trang đang gọi. Trả về một Promise được giải quyết với tham chiếu đến một WindowClient.
respondWith() Thử nghiệm: Ngăn chặn xử lý sự kiện mặc định và cho phép bạn tự cung cấp một Promise cho đối tượng PaymentResponse.

Khi phương thức PaymentRequest.show() được gọi, một sự kiện paymentrequest được kích hoạt trên service worker của ứng dụng thanh toán. Sự kiện này được lắng nghe bên trong service worker của ứng dụng thanh toán để bắt đầu giai đoạn tiếp theo của quá trình thanh toán.

let paymentRequestEvent;
let resolver;
let client;

// `self` is the global object in service worker
self.addEventListener("paymentrequest", async (e) => {
  if (paymentRequestEvent) {
    // If there's an ongoing payment transaction, reject it.
    resolver.reject();
  }
  // Preserve the event for future use
  paymentRequestEvent = e;

  // …
});

Khi nhận được sự kiện paymentrequest, ứng dụng thanh toán có thể mở một cửa sổ trình xử lý thanh toán bằng cách gọi PaymentRequestEvent.openWindow(). Cửa sổ trình xử lý thanh toán sẽ hiển thị cho khách hàng giao diện ứng dụng thanh toán nơi họ có thể xác thực, chọn địa chỉ giao hàng và các tùy chọn, và ủy quyền thanh toán.

Khi thanh toán được xử lý, PaymentRequestEvent.respondWith() được sử dụng để truyền kết quả thanh toán trở lại trang web của người bán.

Xem Receive a payment request event from the merchant để biết thêm chi tiết về giai đoạn này.