Development discussions around Shopify APIs
Hi App Developer Community,
The new Shopify Admin API library for Node is here! This library makes interacting with the Admin API easy and works with any backend framework (Koa, Express, etc).
This new library includes all the key features we believe developers are looking for when building a Shopify app, including:
The existing `koa-shopify-auth` package has also been updated to use this new library [migration guide here], as well as our Node & React tutorial and the Shopify App CLI. For some more examples of its usage, please visit the Getting started guide in the GitHub repository.
The future of Shopify Admin API libraries
Shopify is actively updating all our Admin API libraries in 2021 and this new Node library is the first to be released. Our goal is to create a suite of open-source libraries consistent in functionality across a variety of languages and Shopify’s app best practices. We also have future plans to build enhanced experiences on shopify.dev based on these libraries (tutorials with code samples and requests in API references in your language preference).
We want your input to make the libraries as useful as possible, to enable the developer community to get their apps on the Shopify App Store as soon as possible.
Have some feedback? Reply to this post and let us know!
Liam | Developer Advocate @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit Shopify.dev or the Shopify Web Design and Development Blog
Finally we have official NextJs + Koa session token authentication support!
This is great and something I & the Node community has been asking for for quite some time.
However, I just want to point out that since NextJs version 10, they no longer recommend using a separate secondary server (like Koa.js) to handle backend API requests. Instead they have included API routing support directly in the framework: https://nextjs.org/docs/api-routes/introduction
In addition you cannot deploy a NextJS application to Vercel with the official Shopify NextJS + Koa implementation. https://nextjs.org/docs/advanced-features/custom-server
In addition after rolling out my own 100% NextJS implementation of OAuth & Session Token validation on my projects, I'm seeing a huge reduction in page refresh time. The development cycle is so much quicker.
That's my only ask! Thanks again for sharing this with the community, most other NextJS apps are following the official docs and this will help most get their foot in the door.
Hey @dylanpierce share your custom framework 🙂 or at least record a video tutorial about how you made it and sell it, I want to buy 🙂
Thanks @amosmos it's just the authentication portion, no full fledged framework yet.
It's available to download as an npm/yarn package: https://github.com/ctrlaltdylan/shopify-nextjs-toolbox
npm i --save shopify-nextjs-toolbox
yarn add shopify-nextjs-toolbox
And here's an example app repository using the package for authentication with OAuth & the new session tokens without cookies: https://github.com/ctrlaltdylan/shopify-session-tokens-nextjs
All open source and free.
Thanks @dylanpierce , much appreciated by a new Shopify dev trying to use the correct auth flow.
@mattryles glad it's helping you!
Thanks @dylanpierce you're awesome!
For some reason in my original post the smilies I put didn't show, just know I meant it with tons of respect!
@dylanpierce thank you so much for making this available. This has been super useful to me, to be able to get around the necessity of deploying to Vercel but also using queries to a MongoDB.
Thank you so much for sharing this!
@dylanpierce doesn't seem to work with Custom App? Custom app requires API Secret which the configuration (env file) doesn't have. So I suppose your framework is only for Private Apps? 😞
@dgtlmonk no it's compatible with both private & public apps.
You may have mixed up and created an `.env` file but NextJS by default reads `.env.local`.
@dylanpierce apologies for deviating from the main topic, but do you have an example of how can a NextJS API route could consume the `sessionToken` for axios REST Admin API requests? I'm really close to have this working but I think I'm missing a critical step somewhere.
Thank you @dylanpierce, for the help here and for this useful library.
My difficulty was taking the accessToken given out by the middleware and use that to make REST Admin API requests, and that was because I was not passing the information through the `X-Shopify-Access-Token` header, which solved it for me, hopefully the proper way.
Oh I’m sorry, I misunderstood session token with access token.
For others reading this:
* Session Token == the frontend JWT authentication token for proving your merchant’s identity
* Access Token == the backend private key that represents your access to the merchant’s resources within the Shopify Admin API
The idea behind the session token is that it’s publicly accessible in the browser, but it will eventually expire.
The withSessionToken middleware proves that the merchant is using your app and is authenticated - however its up to your implementation to pull the shop’s Access Token from your backend database given the shop’s name (aka origin).
The next-js-shopify-toolbox package gives you the relevant middleware to retrieve this Access Token during OAuth, but it’s up to you to decide where to store it and how to retrieve it later.
Thanks so much for taking the time to go through this Dylan.
I've figured out since that I could use the access token given out by the auth callback, so it all makes a bit more sense to me now. It was my lack of understanding of all involved parts that lead to my confusion, so again thank you for adding this information here.
That's right, and it is a bit confusing with essentially 2 parts of authentication:
1. Access Tokens (server side stored and used) - distributed to your app during the OAuth callback when the merchant accepts your auth scopes (the /api/auth/callback.js example in next-js-shopify-toolbox)
2. Session Tokens (browser side, JWT, generated by AppBridge) - distributed by Shopify's AppBridge, which requires the shopOrigin (aka shop name) and you pass to **your** API using axios. Behind the API on the server, it's up to you to find the corresponding Access Token given the shop's name from the Session Token.
@dylanpierce im getting client_id undefined
Hi there @Liam a very novice questions ..
I am following tutorial but got confuse about Shopify.Context.Initialize ...
can I still use even if my first app will be a PRIVATE ONE ? The readme in the library mention the tutorial is also viable to PRIVATE ... but in Private I do not have a API_SECRET_KEY ( we have SHARED_SECRET ) ...
ANYBODY can help with this Newbie question ?
@GoodfyLabs independently from being a public or private app, you should get the API keys listed on the app main screen as shown here: https://cln.sh/vbENzd
I have a private shopify app therefore I don't have local application running and also I don't have envirement variable HOST. How can I use this library with private app if Shopify.Context.initialize function use a config object ContextParams needs to have HOST_NAME key?
I have npm package "@shopify/shopify-api" version 1.2.1 installed and it has no Storefront API implemented. I don't know why there is no Storefront API in this version of package considering that github repo release with the same version has that API implemented.
Hi @Vyacheslav81 ... that was my intention too ...( use with PRIVATE APPS)
I did some tests and ... in fact I realize that did not work because do not make SENSE ( at least this was my understanding )
Because with Private apps ... you will authenticate every api call using key and password ...
Maybe an expert can explain better
Hi, I hope you are doing well.
I am recently starting work on Simple Public Shopify App (It's literally for learning) with node and react. I have confused about the stack. Shopify is providing the Next JS for Frontend Development and KOA for Backend Development.
According to docs of next js. we can write our own API in the next js. Then Why We use KOA?
It looks like the the library is largely written in Typescript. It would be great to have the actual REST Admin API objects written as types as well from the Shopify team and not a 3rd party so that we can have types we can rely on.
Is something like this on the roadmap for this or another library?
As a business owner, have you ever wondered when your customer's first impression of yo...By Skye Jun 6, 2023
We're excited to announce improvements to the threaded messaging experience in our communi...By TyW May 31, 2023
Thank you to everyone who participated in our AMA with Klaviyo. It was great to see so man...By Jacqui May 30, 2023