State of shopify-app-express

Shopify CLI and Libraries
1

I was wondering what the current state of the shopify-app-express package is, and if Shopify is still actively supporting it. I haven’t been able to find any statements about this.

I see it listed right next to shopify-app-remix in the shopify-app-js repository, however it doesn’t seem like it is up to date or even still being worked on in a meaningful way.

Specifically it seems to still be missing support for managed app installations, managed billing, and probably more features that I’m not currently aware of. It seems to me like Shopify is highly prioritizing Remix, and seems to be leaving everything else up to the dev community (which is totally fine btw, but would be nice to know)

Right now we are in the process of trying to move over to using managed installations, and the only viable way for us seems to be to ditch the reliance on shopify-app-express and writing our own wrapper.

With that said, it’s pretty frustrating how hard it is to find good documentation surrounding this topic. Lot’s of Shopify’s own documentation is either out-of-date, non-existent or really hard to find.

Examples:

  1. Here it says that managed installations are recommended for embedded apps

  2. Alright then, lets read about token exhange

  3. Under “Non-remix App” brings us to docs regarding shopify.auth.tokenExchange

  4. The first line links to session tokens, and access tokens (which is a dead link btw)

  5. Reading the session tokens page it says this:

For the most part, you shouldn’t have to manage the anatomical details of session tokens. In most scenarios, you’ll use a library, such as authenticated_fetch from app-bridge, which generates and includes the session token in your requests. On the backend, you can use middleware similar to validateAuthenticatedSession in @shopify/shopify-app-express.

Okay? but this is not at all talking about managed installations, rather the older “Authorization Code Grant Flow” that we are trying to move away from. Also in app-bridge v4 we no longer need to use authenticated_fetch as the authorization gets automatically injected into global fetch. Also it is directly referring to shopify-app-express which doesnt support managed installations.

So now it’s not really clear what the right path is from just reading the docs. Rather we are just relying on assumptions that we ourselves have to make. Either from piecing together bits and pieces of what documentation there is, where it is not clear what is out-of-date and what isn’t, or from reading through the code on GitHub. We find that the docs a lot of times leads us down the wrong paths, because it’s a mixture of outdated/updated info.

I’m almost certain that we are not the first ones trying to migrate our express embedded apps to these new “managed” systems, are we missing something here?

1 Like
2

Hey @Magnus_Fischer :waving_hand:

Thanks for reaching out here. definitely get where you’re coming from. I dug a bit into our documentation as well and I agree that it’s not the most clear in terms of process or clarity on support for the Express Library.

You are right though that Remix is currently one of our main development focuses when it comes to 3P app frameworks, but I’m more than happy to touch base with our development team internally for clarity on the current status of shopify-app-express for you and the recommended path for Express apps wanting to implement managed installations there. These are for definitely valid questions, especially since the Express repo’s main components seem to have been last updated almost a year ago.

I can’t guarantee a specific turnaround time, but I’ll ping you in this thread as soon as I have more information.

Thanks again for raising this - speak with you as soon as I have more info

1 Like
3

@Alan_G Thank you, I appreciate it.

4

No worries! I was able to touch base with our devs on this for you pretty quickly here.

I was able to confirm with them that our Express library isn’t the top priority at the moment, but my understanding is that we aren’t fully deprecating it in the near term and one of our developers will be getting in touch with the product team directly to flag the documentation inconsistencies so that we can make some improvements for folks who are not using Remix-based app templates.

Another one of the developers who was helping me out suggested using the following doc when it comes to managing session token/managed installation config for non-Remix apps: Set up embedded app authorization

Taking a look there, I think this should help connect the dots between managed installation concepts and token exchange, but if I can assist further, just let me know and I’ll take a look with you.

I also just wanted to confirm I passed your feedback on the docs and the state of the Express library on directly to our developers so this is on their radar.

Let me know if you have any other questions and I hope this helps a bit!

1 Like
5

Thank you, this helped us out a lot!

Since we don’t use the ExitIframe component anymore with the new auth flow. Is there a smart way to redirect the user out of the app?

Say we want to redirect the user to an app subscription confirmation page if during the auth flow, we detect that they don’t have an active/valid payment plan.

6

Nevermind! Figured it out by looking through the remix-app package.

You just need the server to send a html response with the app-bridge script, and a script that navigates to your desired url with window.open() in the header.

1 Like
7

I’ve been maintaining a MERN boilerplate for a while now that’s updated, if you want to take a look / use as reference. It doesn’t use the Express wrapper but the @shopify/shopify-api package directly which powers all the wrappers:

3 Likes
8

Hi kinngh,
I didn’t understand from the template code if this template works with shop specific webhooks or app config webhooks.

Can you clarify this?

9

There’s two types of webhooks:

  1. Managed Webhooks (or what you call app config webhooks): Managed by shopify.app.toml file and is registered on every store that your app is installed in
  2. Shop specific webhoks: These are webhooks that you register via GraphQL. Use case would be that you conditionally want to register/deregister webhooks based on a user’s plan.

The boilerplate uses shopify.app.toml or the Managed Webhooks concept to register webhooks for your app by default and is the recommended way to subscribe to webhooks. If you want to conditionally register webhooks, you can subscribe to a regular webhook where the webhook’s function can register/deregister a webhooks based on your needs.

1 Like
10

@Magnus_Fischer Thanks for making this post. I’ve been using the Shopify App Express library myself and ran into some issues with OAUTH Grant Authorization flow.
The docs said to move over to a managed Shopify installation and use a token exchange but the docs led me in circles.

Did the suggestions from Shopify manage to help you out with this problem?
I’m planning on looking through everything today but wanted to see if it worked out well for you.

11

@Patrick_Pierre Same here, I agree, the token managed installation is too complex by the docs.
Is there any migration guide for express app from the official Shopify app node express JS template?
I tried using kinngh template which is looking great, but it is too different from the official Shopify app express template for JavaScript.

BTW, @kinngh if you have a migration guide to your template as well it would be wonderful to upgrade all our apps on the company.

12

Hey @kinngh, I took a look at your MERN Shopify App repo and it was very helpful.
I was comparing your repo to this link from Shopify on how to set up Embedded App authorization.

I noticed that the Shopify tutorial uses a method from the Shopify API library (for node) to handle validating a session token: shopify.session.decodeSessionToken

And I also noticed that you have a utility function in your repo called validateJWT which seems to do the exact same thing as the above method from the Shopify library.

I’m curious about why you chose to write your own function to do this vs. just using the one from Shopify.

Would you mind sharing some of your thoughts on this?

Also just so you know, I’m asking because this is my first time building a Shopify app or working on a backend project of this size and I’m just trying to learn from people like you who have a lot more experience.

13

Hey @oribenez
You could just replace the shopify-app-express library with the Shopify API library since it seems like Shopify is actively maintaining that one.

Then you can reference the following files to see how Kinngh is handling the Token exchange:

  • shopify.js (configuration set up for Shopify API npm package)
  • validateJWT.js (utility file used to validate requests sent from the front end with Shopify app bridge)
  • Middleware Files (various middleware functions involved in setting up the Auth process)
  • isInitialLoad.js (specific file that includes code for the Token Exchnage)
  • server/index.js (can see how he is using all of the above files to set up the project)

These files are all taken directly from Kinng’s repo

The only thing missing from his token exchange strategy is a Bounce Page to get the session token from App Bridge if it is not present in a request sent from your frontend.

Here’s a link to an explanation with some code taken from a Shopify tutorial.

Hopefully this helps you to migrate your apps over to the Token Exchange strategy for OAUTH. This is stuff I’m currently trying to implement into my app now so I really hope this solves the problem for the both of us.

2 Likes
14

Migrations are difficult and very different so doesn’t make sense to write one guide tbh. There were attempts, that I can tell you

15

IIRC when I wrote it that method didn’t exist

16

@kinngh Thanks again for taking the time to respond. I’m building my first app and your repo has been very helpful to me. I’m actually in the middle of setting up the mandatory compliance webhooks in my app and had a question for you.

I noticed that when you are processing requests related to the mandatory compliance webhooks, you used a custom middleware function called verifyHmac and when dealing with the app/uninstalled webhook you use a method from the shopify package: shopify.webhooks.validate.

Is there a reason why you are using a different approach for both of these webhook types?

17

The GDPR hooks use HMAC verification and others use the regular webhook validation. Trigger a GDPR hook and save the body and headers to confirm this^