Authenticate Shopify Customers with Auth0

There are two ways to set up Auth0 for customer login in a Shopify Store. One is (relatively) easy and one is bit harder. Note that we’re talking about Customer login here. If you’re looking to set up Shopify Admin login via Auth0, the way to do that is just to use the off-the-shelf shopify social login.

The Easy(ish) Way: Multipass

Shopify’s supported solution for single-sign-on is Multipass. There’s a good write up on how to set up Multipass with Auth0 linked below, which I would recommend you follow as a first “pass” ( :wink: )

https://rovani.net/Shopify-Auth0-Multipass

If you have any questions about that implementation, the author of that piece seems quite responsive in its comment section. I can also answer questions about it here if need be, as I’ve handled a few multipass implementations.

If you’re working with a site on Shopify Plus, this is definitely the solution you should use. If you can potentially afford Shopify Plus, I would give this feature considerable weight if identity management is on your radar, as it makes things considerably easier.

The Hard, But Possible, Way

So, what if you really can’t afford Shopify Plus? It is still possible to implement Auth0 login for Shopify, but it requires a fair bit more work, and is potentially less secure. It does work though.

The basic structure is as follows:

  1. Existing Shopify Client account elements are overriden in a Shopify theme. When a guest performs an action, or goes to a route, that requires a customer account, they are redirected to Auth0. Auth0 tenant interaction is handled with the Auth0 SPA SDK.

  2. In Auth0, Rules are used to manage Shopify Customer account CRUD via the Shopify API. All active Shopify Customer data is stored in Auth0, including their password, which is encrypted.

  3. After a user has authenticated in Auth0, the return payload includes their account login details, i.e. their shopify customer email and password (encrypted). These details are used to log the user into Shopify in the background using the same endpoint the normal Shopify login form uses.

This can be setup for both sign up and login processes starting in Shopify. There’s ways to handle email verification using the same basic structure. You can even take the user back to an existing Checkout session upon authentication. It definitely has quirks though, and is not straightforward to implement correctly.

I’ve implemented this successfully once. I’ve abstracted what I can out of that implementation, and made it available here:

I’d be interested in thoughts on this approach, and or any similar ways to use Auth0 login with Shopify without Multipass. If you’re interested in either solution don’t hesitate to reach out here, or to me directly.

2 Likes

Hi Angus,

Thank you for the detailed explanation!

Regarding the hard, but possible way, could you provide your thoughts on the following?

  1. Does this still work?
  2. Do you think it will keep working that way? My main concern is, the feature seems to be a part of pricey Shopify Plus, so they might one day eliminate the possibility of the workaround?

Thanks!

Alex.

Yes it does, however it’s no longer in production (for unrelated reasons).

There are no guarantees, but I do think it will keep working this way because the Shopify specific stuff is just using standard aspects of Shopify themes. For example, Shopify has a guide on how to customise the login form in a theme: customers/login.liquid. While this is not the same thing, it’s a variation on the theme (pun intended). There’s nothing here that is “hacking” the shopify customisation interfaces per se.

I’ve done a little cleanup and abstraction of what we used to implement that approach. I’ve had to strip out some things that were specific to that implementation, however you should be able to use this as at least a starting point, if not getting 95% of the way there. There’s instructions in the readme.

1 Like

Thanks a lot, Angus!

1 Like