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?
Solved! Go to the solution
This is an accepted solution.
You can see our upcoming plan for this year in our FAQ https://shopify.dev/concepts/apps/subscriptions-faq
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.
@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.
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/
@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.
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.