Introduction
This is a common issue that affects sites with Apple Pay checkouts. It occurs during the checkout process when an Apple Pay session is started; the issue either prevents the payment sheet from appearing or causes it to disappear before the session ends properly. This results in the user being unable to checkout via Apple Pay, as they cannot complete or end their current payment session or start a new session.
Error Description
Error Signature:
JS Error: Page already has an active payment session.
Error Message:
Page already has an active payment session.
Issue Discovery
To understand this issue, we must examine the steps of the Apple Pay logic flow. Consult Apple's guide to Requesting an Apple Pay Payment Session for a detailed look.
Merchant validation is the first step when submitting a payment via Apple Pay. This involves the following:
- Create an ApplePaySession object.
- Call the
.begin()
function with the new ApplePaySession object to present the payment sheet and initialize the merchant validation process. - Once the merchant validation process is started, the
onvalidatemerchant
function is called with aApplePayValidateMerchant
object. This function calls your server, which in turn makes a new request to the remote Apple Pay server. - The Apple Pay server responds with a Merchant Session object for your server to pass into the
completeMerchantValidation
function. This completes the validation process and allows the user to make a payment with Apple Pay
The active payment session error indicates that the onvalidatemerchant
function has failed, as it cannot request a new Merchant Session object from the Apple Pay server. This is because of the following rules Apple enforces for the object:
- You can only use a merchant session object a single time per transaction.
- The merchant session object expires five minutes after it is created.
- The merchant session request must be sent from your server. It cannot be requested from the client.
For more details, refer to this Discussion from the Apple support forums from a developer experiencing the same error with their Apple Pay session implementation.
In the discussion above, Apple support suggested potential causes:
- The code that calls out to your server and receives the Payment Session to pass into
completeMerchantValidation
. If this is being hit twice then your client side code may have an error. - Along with #1 you could also debug your server to see if the same
validationURL
request is being run twice from the client, prompting two responses. - Lastly, the entire process could being running twice starting with
new ApplePaySession
. Examine the code that runs this path. This is likely when the user clicks or taps the Apple Pay button.
Uncovering the specific cause requires further investigation, as it likely depends on your implementation of the Apple Pay merchant validation process. However, in our experience with multiple Noibu clients, we’ve seen the following causes of the error.
Error Cause #1: User clicks Apple Pay multiple times
Since the Apple Pay merchant validation session may take several seconds, the user may not understand that they've triggered the start of an Apple Pay session, and may try the Apple Pay button multiple times. Unfortunately, this prevents the Apple Pay form from appearing and triggers the error, blocking the user from using Apple Pay.
There is an interesting discussion of this scenario on the Stripe Github.
From this discussion, developers suggested disabling the Apple Pay button after a user click until the merchant validation process completes. It could also help to add a loading indicator or confirmation that the click was effective.
Error Cause #2: Apple Pay triggered without user intervention
The site implementation of Apple Pay may have a bug that causes the site to trigger the merchant validation flow on the checkout page before the user has clicked the Apple Pay button. This summons a payment form that isn't visible to the user, and when the user does click Apple Pay, they are unable to proceed.
This scenario is less common, but not impossible.
Risks and Mitigation
Once this error occurs, a user cannot checkout using Apple Pay unless they refresh or manually force the Apple Pay session to end. This can cause significant friction for users, especially since the error usually doesn’t usually produce a visible error message. We recommend prioritizing the issue and actioning a fix as soon as possible.