Headless Checkout with PayPal Express

[Nexum]

Hi,

I am currently trying to replace a custom paypal express implementation with Shopify.

We are selling Download products, so no shipping info and so on required, also only 1 product per sale, no cart.

What I am trying to achieve:

1. User goes to our Website, klicks "Buy Now"

2. User goes directly to Paypal

3. User returns to the Website (now the website has the information if the checkout was successful)

So far i tried to do this with the Storefront API but i cant seem to find a way to "bypass" the shopify checkout page (webUrl), next i tried to to the same thing with a custom app (which isnt allowed to use the checkout apis), next i converted the private custom app to a "public" custom app and converted it into a sales channel (because it seems this is the way to go?) but now i still cant add my products as line items since they are an "Unprocessable Entity" wich i guess means they are not published to the sales channel. sadly i can't event see the sales channel in the backend, wich is (i think) because its not listed yet?

please help me 😕

Cheers,

Nexum

[vix · Accepted solution]

Hi @Nexum 

The Storefront API is designed to complete the entire journey. You should utilize the webUrl with PayPal as your payment gateway. This will bring the customer from Buy Now --> Checkout --> Paypal Express --> Thank you page. 

A sales channel is built with the concept of multiple merchants in mind, not for a single storefront. This is what the Storefront API is for! 

[Nexum]

Hi @vix 

Thank you very much!

One question tho, since it does not seem to be possible to use a paypal sandbox account to test this, one more questions just to be sure.

When i enable only paypal as gateway, the checkout will skip the checkout page and redirect straight to paypal ? i dont want the user to enter an email / shipping address anywhere (everything is stored in paypal, so this would not make sense) 

Cheers, 

Nexum

[vix]

Hey @Nexum 

When you redirect to the webUrl the first option the customer will see is "Express checkout" *or* they can enter their details, at the end of the details page they would be redirected to Paypal. Here is the flow (the same for the Shopify Online Store) 

1. 

Or on the payment page: 

2. 

[Blockbase]

Would love to know as well if it is possible to use PayPal as a checkout method with Storefront API, and to skip the Shopify checkout page.

It would make no sense to have my own Storefront-powered checkout page, and then redirect to another checkout page to support PayPal.

Thanks in advance

[vix]

@Blockbase 

You can look at rebuilding the redirect that happens when you are on the checkout. The typical flow is hit the checkout --> click paypal express. If needed, you could consider rebuilding that redirect URL from a "cart" level to avoid another step. 

[Blockbase]

@vix 

That sounds interesting. How would I do that? Is there any documentation on this? I'd really like to avoid another step, as this would hurt conversion rate.

Thanks for your quick response.

[Blockbase]

Hi @vix, our questions have not yet been answered. Could you please elaborate on how to make PayPal + Storefront checkout work, without having to redirect to the webUrl (shopify checkout page)?

The whole idea of storefront API is that we do not need the shopify checkout page.

Thank you!

[vix]

Hi @Blockbase 

That idea would need to be looked into by yourself or dev team. It would be an unsupported workaround and I'm not able to go into details on the specifics - the Storefront API by design redirects to the web checkout (which includes PayPal Express as the checkout option). This should not lead to conversion drop off, as our checkout is trusted by customers. 

[Probesya]

Hi @vix, that was not a helpful answer. 

@Blockbase simply asked if you could direct him to developer docs regarding the following statement that you made:

If needed, you could consider rebuilding that redirect URL from a "cart" level to avoid another step.

If rebuilding the redirect URL from the cart level is actually a thing, would you kindly share the relevant section in the documentation?

[vix]

As stated above, there is no documentation for this. Out of the box it is not possible, we cannot provide code solutions for every custom workaround.

[KathrynJohns]

Hi,

I measured my checkout loading speed today. Even with all customizations, it has good loading speed. But I use Checkify's checkout page, not standard: https://checkify.pro/