ServiceWorkerGlobalScope: sự kiện paymentrequest
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.
Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
Note: This feature is only available in Service Workers.
Sự kiện paymentrequest của giao diện ServiceWorkerGlobalScope được kích hoạt trên một ứng dụng thanh toán khi một luồng thanh toán đã được khởi tạo trên trang web merchant thông qua phương thức PaymentRequest.show().
Cú pháp
Sử dụng tên sự kiện trong các phương thức như addEventListener(), hoặc thiết lập một thuộc tính trình xử lý sự kiện.
addEventListener("paymentrequest", (event) => { })
onpaymentrequest = (event) => { }
Loại sự kiện
Một PaymentRequestEvent. Kế thừa từ ExtendableEvent.
Ví dụ
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ở cửa sổ xử lý thanh toán bằng cách gọi PaymentRequestEvent.openWindow(). Cửa sổ xử lý thanh toán sẽ hiển thị cho khách hàng một 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à tùy chọn, và ủy quyền thanh toán.
Khi thanh toán đã được xử lý, PaymentRequestEvent.respondWith() được sử dụng để chuyển kết quả thanh toán trở lại trang web merchant.
Xem Receive a payment request event from the merchant để biết thêm chi tiết về giai đoạn này.
Đặc tả kỹ thuật
| Thông số kỹ thuật |
|---|
| Web-based Payment Handler API # the-paymentrequestevent |