Payment Request API

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The Payment Request API provides a consistent user experience for both merchants and users. It is not a new way for paying for things; rather, it's a way for users to select their preferred way of paying for things, and make that information available to a merchant.

Payment Request concepts and usage

Many problems related to online shopping-cart abandonment can be traced to checkout forms, which can be difficult and time consuming to fill out and often require multiple steps to complete. The Payment Request API is meant to reduce the number of steps needed to complete a payment online, potentially doing away with checkout forms. It aims to make the checkout process easier, by having payment apps store a user's details, which are then passed along to a merchant, hopefully without requiring an HTML form.

To request a payment, a web page creates a PaymentRequest object in response to a user action that initiates a payment, such as clicking a "Purchase" button. The PaymentRequest allows the web page to exchange information with the user agent while the user provides input to complete the transaction.

You can find a complete guide in Using the Payment Request API.

Note: The API is available inside cross-origin <iframe> elements only if they have had the allowpaymentrequest attribute set on them.

Interfaces

PaymentAddress

An object that contains address information; used for billing and shipping addresses, for example.

PaymentRequest

An object that provides the API for creating and managing the user agent's payment interface.

PaymentRequestEvent

An event delivered to a payment handler when a PaymentRequest is made.

PaymentRequestUpdateEvent

Enables the web page to update the details of the payment request in response to a user action.

PaymentMethodChangeEvent

Represents the user changing payment instrument (e.g., switching from one payment method to another).

PaymentResponse

An object returned after the user selects a payment method and approves a payment request.

MerchantValidationEvent

Represents the browser requiring the merchant (website) to validate themselves as allowed to use a particular payment handler (e.g., registered as allowed to use Apple Pay).

Dictionaries

AddressErrors

A dictionary containing strings providing descriptive explanations of any errors in any PaymentAddress entries which have errors.

PaymentDetailsUpdate

An object describing changes that need to be made to the payment details in the event that the server needs to update information following the instantiation of the payment interface but before the user begins to interact with it.

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
Payment_Request_API
60
15
No
Available only in nightly builds. Requires dom.payments.request.enabled to be set to true and the comma-delineated list in dom.payments.request.supportedRegions to contain one or more of the supported 2-character ISO locales, currently US and CA.
No
47
11.1
No
53
No
Available only in nightly builds. Requires dom.payments.request.enabled to be set to true and the comma-delineated list in dom.payments.request.supportedRegions to contain one or more of the supported 2-character ISO locales, currently US and CA.
44
11.3
6.0
PaymentRequest
60
15
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0
abort
60
15
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0
canMakePayment
60
16
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0
id
60
16
No
Available only in nightly builds.
No
47
11.1
No
60
No
Available only in nightly builds.
44
11.3
8.0
merchantvalidation_event
No
No
No
Available only in nightly builds.
No
No
11.1
No
No
No
Available only in nightly builds.
No
11.3
No
onmerchantvalidation
No
No
No
Available only in nightly builds.
No
No
11.1
No
No
No
Available only in nightly builds.
No
11.3
No
onpaymentmethodchange
76
79
No
Available only in nightly builds.
No
47
12.1
No
Yes
No
Available only in nightly builds.
44
12.2
Yes
onshippingaddresschange
60
15
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0
onshippingoptionchange
60
15
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0
paymentmethodchange_event
76
79
No
Available only in nightly builds.
No
47
12.1
No
Yes
No
Available only in nightly builds.
44
12.2
Yes
shippingAddress
61
15
No
No
47
No
No
53
No
44
No
6.0
shippingaddresschange_event
61
15
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0
shippingOption
60
15
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0
shippingoptionchange_event
61
15
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0
shippingType
60
15
No
Available only in nightly builds.
No
47
11.1
No
55
No
Available only in nightly builds.
44
11.3
6.0
show
60
15
No
Available only in nightly builds.
No
47
11.1
No
53
No
Available only in nightly builds.
44
11.3
6.0

BCD tables only load in the browser

See also

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Payment_Request_API