Today I learned about the wonderful magic of @auth0. #200wordsTIL
In just 46 minutes we got an authentication flow working for a @gatsbyjs site. No backend required.
Here's how authentication with @auth0 works in a nutshell. I'm still figuring out the details.
1. Make an auth0 account
2. Copypasta their tutorial code for "Single Page App"
3. Make a @gatsbyjs page to serve the callback URL
4. Renew sessions in gatsby-browser.js
@auth0's tutorial code tells you to build an "Auth service". It's really just an object that handles authentication state via their SaaS. Like a Redux store or something.
Main actions are login, logout,and handleAuthentication
window.location.href should be Gatsby's navigate() function but weird errors. @kylemathews any idea why window.__navigation is undefined?
Callback page is easy. Spinner when you visit /auth0_callback, wait until auth.handleAuthentication() redirects to homepage.
Renewing sessions happens when a user loads the page in theory. It's throwing errors for me, some state isn't recognized.
So that's the theory. I get the login flow, come back to the page, and set localStore.isLoggedIn.
But React is having trouble reading that and renewing sessions fails.
Must be doing something wrong with @gatsbyjs and localstorage 🧐