FROM CACHE - en_header

Headless Reac.JS and Next.js Web store that connects to Storefront API with Payments

New Member
3 0 6

I rarely post, it seems there is always an answer out there, so there is never a need, but this time around it seems I have been beaten by Google.

The Problem is simple: Build a Headless Front-end Website using ReactJs and Next.js that connects to and leverages Shopify's Backend. Sounds simple right?

And once you get past various different APIs and inconsistencies amongst them (But let's not get into that now) you come to payments.

Shopify Web Checkout is not an option, it's another redirect and another step for users to give up. We need payments to be processed there and then on the Web App. (0-Step Checkout)

So what is the solution? How do I integrate payments (Credit Card, Paypal, After Pay, Apple Pay, Google Pay) with Shopify Payments and other third party payments?

OK so I know I have to use Checkout API, which is fine but then I need Payment Processing (Not even sure if this works with accelerated checkouts), except you, can't have that unless you are a Sales Channel, and You can't be a Sales Channel unless you are a Public App (Listed or otherwise). 

What am I missing, is it possible that you simply can't do checkouts on custom web apps? How do mobile apps get around this, surely Shopify doesn't redirect those users to the webform and what about the highly advertised in-game purchasing. I have to be missing something here. Can anyone out there help me understand this better?

Replies 4 (4)
4 0 0

Hello @ruzdic , 
I have same problem as you, have you figure it out by now ?

Thanks in advance

8 0 2

Yep, same problem!  I want the Apple Pay button right there in the hero.  Zero friction checkouts.  

Stripe can do this.  I messaged SnipCart to see if they can do it, will report back.

I really hope there's a Shopify solution though

4 0 6

Any updates in this regard? I'm about half way done implementing it, but there is a severe lack of documentation on how to set this up google pay on Headless. Not sure if I need to create my own Google Pay merchant account or if I use an existing one. Any guidance would be appreciated.

New Member
3 0 6

The short answer is, you can't. You have to use Shopify checkout which is on the Shopify domain, you can't customise the checkout. We have gotten around this issue by not using Shopify. Magento is far better for headless.