Add 5 login methods to your Hasura app in 5 minutes with OneGraph’s AuthGuardian
AuthGuardian by OneGraph is live on Product Hunt today, check it out here!
- Add sign-on with dozens of services like GitHub, Twitch, Stripe, Salesforce, and more
- Easily, visually describe authentication and authorization rules for your app, API, or service.
The best part? It speaks native Hasura authorization out of the box!
That means you can set a user’s
X-Hasura-User-Id to their Spotify userId, add an
admin default role if they’re part of your Stripe organization, set a session variable of
discount: 0.10 if they’ve contributed to your open-source project on GitHub to use in your custom Hasura functions
So let’s see how once you’re in the groove with AuthGuardian, you can do all of this in ~5 minutes:
- Add login with 5 different services, including:
- Set a user as admin if they’re part of your GitHub org or your Stripe org
- Set a session variable with a 10% discount for a user if they’ve starred the Hasura
graphql-enginerepository on GitHub
- Deploy a AuthGuardian React starterkit to Netlify for testing
- Use Hasura’s remote schemas to query into the service API
- Configure Hasura to accept AuthGuardian JWTs
Step 1: Add login with 5 services!
Let’s start with configuring AuthGuardian to allow Hasura sign-in for five different services!
First, sign up for AuthGuardian (fun fact, the AuthGuardian sign up is powered by AuthGuardian!) with your GitHub or Netlify account, or just plain ol’ email.
That’ll take you straight to the AuthGuardian settings panel:
Here you can configure a series of rules: Each rule has conditions (“If this user is logged into GitHub and has starred my repository”), and if the condition is
true , then there are also effects that run to create your final JWT (“Then set the Hasura user id to their GitHub userId and create a session variable of
Login 1: Stripe!
For our first rule, we’ll build:
If this user is logged in to Stripe, then set their Hasura
user-idto their Stripe
Stripe login - test it out!
Next we’ll log into Stripe and use our JWT preview to make sure the result looks like what we expect:
✅Stripe login: Done!
Step 2: All the others!
Let’s do the same for GitHub:
And why not throw in Spotify login as a bonus while we’re at it?
Step 3: Set Hasura session variables
But we can take it further! Hasura lets you set session variables for use in authorization permissions, and in custom Postgres functions [TODO: FIX THIS LINK]!
Let’s set a session variable of
true if (and only if!) they’ve starred the Hasura GraphQL Engine repository on GitHub:
Step 4: Setting Hasura auth roles
In our application we want admins to be anyone who’s a member of our Stripe or GitHub org - easily done!
When this user on GitHub is a member of an org called “Hasura”, then add
adminto their list of allowed Hasura roles
And if they’re a member of our Stripe org, then we’ll make them use the admin role by default:
When this user on Stripe has an account id (organization id) equal to
<my-stripe-account-id>, then set their default Hasura role to
Step 5: Log in ALL THE SERVICES!
What happens in our JWT preview if we log into all of the services we just set up?
Our JWT has our custom Hasura claims set up exactly as we expect - success!
Final step: Configure Hasura and AuthGuardian for great harmony
The last step is configuring Hasura to accept JWTs signed by OneGraph’s AuthGuardian - no worries, you’re covered there as well! AuthGuardian has a config generator under
Auth Services => Settings that will give you a copy/paste line for updating the JWT auth settings for Hasura on Heroku or standalone.
As an advanced option, you can also change the JWT generation method here in case you’d like to use shared-secret instead of public-key signatures.
Bonus: Deploy a live React app with your logins preconfigured
Install tab, you can click on the
React starterkit to deploy a pre-configured app live to either Netlify or Vercel in just a few seconds!
The future: Remote schemas, joins, tigers and bears, oh my!
The JSON web tokens generated by AuthGuardian are also compatible with Hasura’s excellent remote-schemas feature: Bring in OneGraph as a remote schema, have your users log in with AuthGuardian, and immediate query into Salesforce, Stripe, GitHub, and more.
And AuthGuardian tokens are perfectly forward compatible with planned Hasura features like the mind-blowing remote-joins as well, so you can build your apps today knowing that you’re set up to take advantage of Hasura’s incredible development pace.
Try it on your own Hasura project!
You can try AuthGuardian with your own Hasura project by signing up on the AuthGuardian Landing Page - we’d love to hear what you think!
About the author
This blog post was written by Sean Grove - Founder of onegraph.com, under the Hasura Technical Writer Program.