Solved

Integrating with Headless Storefront API

sdornan
Visitor
1 0 0

We're thinking about using the Shopify Subscription APIs with our existing site that uses Shopify's Storefront API. Since the Storefront API is headless, we would be adding the presentation of he subscription options to our existing product pages that we built ourselves. Is this something that is supported?

Accepted Solution (1)

Philibert_Dugas
Shopify Staff
36 13 16

This is an accepted solution.

👋 Hey! This is not currently possible, we’re looking at adding support for the Storefront API in the second half of this year.

You can see our upcoming plan for this year in our FAQ https://shopify.dev/concepts/apps/subscriptions-faq

To learn more visit the Shopify Help Center or the Community Blog.

View solution in original post

Replies 10 (10)

Philibert_Dugas
Shopify Staff
36 13 16

This is an accepted solution.

👋 Hey! This is not currently possible, we’re looking at adding support for the Storefront API in the second half of this year.

You can see our upcoming plan for this year in our FAQ https://shopify.dev/concepts/apps/subscriptions-faq

To learn more visit the Shopify Help Center or the Community Blog.

rileywestbrook1
Visitor
2 0 0

Hi, is there any update on this? I see that it says in the roadmap that it was released in July, but have seen no documentation or news on the subject.

 

Thanks.

Mikepre
New Member
4 0 0

Hey,

second the question posed above - has this been made available on the storefront API? 

Cheers,

ck19
Visitor
1 0 0

Can somebody provide an update here?

Mikepre
New Member
4 0 0

Hey, just thought I'd update on my experience. Wasn't sure of integrating the new Subscriptions API for a long time into my headless build, but finally figured out the approach — you still need to use an app such as ReCharge or Bold Subscriptions (the Subscriptions API is open to app developers), then when you create subscription item in their service, the product and subscription details are available using the Storefront API. And you can have users check-out by using the new Cart API (in api version 2021-10). This dev doc is particularly helpful and took ages to find before I realised it was exactly what I needed — I don't know about you, but especially to begin with the Shopify docs are almost cryptic and so hard to navigate.

AndrewPC
Visitor
1 0 0

@Mikepre Would love to know a little bit more about the flow that is needed to use Cart API with Bold/Recharge? They're docs seem to suggest that using Storefront API is not currently supported - is this due to API version 2021-10 only being a release candidate?

We have a custom storefront using the storefront API, but our checkout is still Shopify, and we'd love to be able to use one of these subscription apps.

Mikepre
New Member
4 0 0

Hi @AndrewPC, yeah I would assume that the official docs say not supported due to 2021-10 being release candidate only at the moment, or otherwise just not being up-to-date. However, personally I think the alternative without using the Cart API in 2021-10 isn't feasible, so willing to take the (somewhat small) risk. Especially considering full release is only a couple of weeks away. 

If you're looking for guidance on how to use ReCharge + Storefront, I use Nuxt (but it could be any SSG, eg Gatsby/Next) and deploy with Netlify so I use their serverless functions to send the GraphQL queries to the my Storefront API endpoint to instantiate the cart, add/remove items from the cart, send the cart to checkout, etc. I basically based all of those functions off this fantastic starter: https://github.com/bencodezen/shopify-nuxt-kit — Netlify has this same tutorial several times with different frontend frameworks, so definitely worth a look: https://www.netlify.com/tags/shopify/ 

Cheers,

polguixe
Shopify Partner
18 1 4

@Mikepre do you know any way to convert a Cart to a Checkout?

The 2021-10 release can create a Cart and that returns a checkoutUrl, however, we can't use the cart API to add an address and shipping options. And the Checkout storefront API is not compatible with Subscriptions. Hence I was thinking on creating a Cart first and then convert it to a Checkout modify it to add the address and shipping options. 

https://origen.studio
Mikepre
New Member
4 0 0

Hey @polguixe I'm not a Shopify dude, and definitely no guru, can only speak to my experience as outlined above. However I'm pretty sure that the Checkout Flow and the Cart Flow are mutually exclusive, you can only use one or the other and probably don't convert. I think maybe you can add customer details to the Cart, but not sure, you will have to check the docs.

Fuz-Tech
Shopify Partner
4 0 3

Same issue here, it appears as though there is no way to retrieve a checkout ID from the cart creating using the cartCreateMutations. So you'd be stuck with web checkout