Stripe: Use apple pay on the web for a subscription

Question

In the documentation for setting up Apple pay with Stripe, the steps tell you to create a payment request with stripe elements in order to display the apple pay button - the example request is a one-time direct charge. You must have a payment request to display the button - so how can I create a payment request for a subscription? The payment request object is a stripe elements thing and is not described in the stripe api.

var elements = stripe.elements();
var prButton = elements.create('paymentRequestButton', {
  paymentRequest: paymentRequest,
});

// Check the availability of the Payment Request API first.
paymentRequest.canMakePayment().then(function(result) {
  if (result) {
    prButton.mount('#payment-request-button');
  } else {
    document.getElementById('payment-request-button').style.display = 'none';
  }
});

The flow for using a credit card is completely different. It doesn't require any payment request, you simply create a token from the stripe elements card form to create a customer.

The Stripe support page for Using Apple Pay for recurring payments just says "apple pay will create a token" but provides no clue how you would set it up without a one-time charge.

How can I make stripe display the apple pay button without requesting payment? If I have to request payment, is it just for one interval of the subscription, and will this amount be able to be billed on a recurring basis?

ttmarek ttmarek · Accepted Answer · 2021-02-10T15:57:54

The payment request that you make with Stripe.js does not actually process a payment. It simply confirms that the user's browser supports Apple/Google Pay, and displays a payment sheet with the provided payment details. After the user authorizes the payment described on the payment sheet, Stripe will produce a payment method. At this point, if you ended your integration, the user would never be charged - you would simply have a Stripe payment method ID. What you'd need to do at this point is:

Save the payment method ID to a Customer: https://stripe.com/docs/api/payment_methods/attach
Set the payment method as the default for subscription invoices: https://stripe.com/docs/api/customers/update (by setting invoice_settings.default_payment_method)
Subscribe the customer to a recurring Price (e.g., https://stripe.com/docs/billing/subscriptions/fixed-price)

You would trigger all of the above logic as a result of receiving the payment method from the payment request:

paymentRequest.on('paymentmethod', function(ev) {
  const paymentMethodId = ev.paymentMethod.id;

  // Send ID to your server to:
  //  a) attach it to a Customer
  //  b) set it as the default for subscription invoices
  //  c) create the subscription
});

Stripe: Use apple pay on the web for a subscription

1 Answers