We recently migrated from the default Shopify setup to a headless Next.js site. On our old site, we had an Apple Pay button on the PDP that allowed customers to purchase a product directly, without going through Shopify’s checkout.
To replicate this on the headless site, my current plan is:
- Use a PSP like Stripe – for example, their Express Checkout Element.
- Once the order is completed, listen for Stripe’s webhook → notify our backend → create the order in Shopify via the Admin API.
Does this sound like the correct approach, or is there a simpler way to achieve the same result?
Thank you in advance.
Hey @sebastienpowell,
The current supported methods of accepting apple pay are outlined here: https://help.shopify.com/en/manual/payments/accelerated-checkouts/apple-pay
For mobile experiences, you can look in to the checkout kit implementation of apple pay Set up accelerated checkouts
Thanks @KyleG-Shopify. The first link you shared shows how to set things up on the backend, but doesn’t mention anything about the frontend. The second link does, but I think, specifically for mobile apps.
So am I right in saying that if we want to implement this on our Next.js / React store, we would need to approach in the way I described above?
Good question. Let me dig in more to see if we have specific guidance for custom web based storefronts. I’ll report back what I find.
Hey Sebastien,
Looping back here. I appologize for the delay as I was away. I was looking in to this with our team and currently there isn’t a direct feature for apple pay on the product page through custom storefronts. It would still be available as an option at checkout though.