Demystifying Auth - ELI5
So you've built your shiny new app and operations asks.. 'So how will our users login?' Panic? No chance if you can build an app you can build an authorisation flow..
Simple right?
Easy peasy you think. Store the email addresses salted passwords in a database... and some other stuff... 5 story points no big deal. But what about firewalls, operation system updates and security concerns.. What seems like an easy feature is quickly becoming a monster and thats before the security operations and audit team get involved!
Maybe not so simple.. 😩
Now your users need to be able to use multi factor authentication to login for compliance reasons... ok we can make a service to send push notifications with OTPs generated from a secure cryptographic... Panic! This is getting difficult.. Maybe we can just buy something off the shelf to do this for us.. even better maybe theres something open source..
One short google search later.. 😩
Drum roll please... oAuth to the rescue! 🚀
Of course you knew about this solution before googling... 🤥
Ok so cards on the table... I myself have previously used oAuth providers for personal projects and even work related features but I did not really understand what was going on during the process.
Typically I asked a few of the engineers I looked up to if they could explain it and pretend that I am a french bulldog while they do.
To my surprise they also did not really know in great detail what was going on with it. 'Magic' was one response... this meant little to a french bulldog so I moved on.. Grab a coffee and let me explain in terms devs can understand what the heck is this oAuth and why does everyone seem to use it?
Whats the craic with this oAuth stuff then.. ☘️
So have you ever opened a website and been greeted with a 'login with X option'? (Códu seems to use Github). A very high level overview what's happening when logging into Códu is.
- Click login with Github on códu.cu
- Redirected to a Github login screen
- Input your username and password
- Redirected back to Códu where your user account details can be pulled from Github
This is a massive simplification of whats happening and skips the signup with Github step but the bones of the solution are there.
Ok so just at this extremely high level we can already see some serious advantages to using oAuth
- We do not have to worry about data breaches (Github have more security staff then most companies have staff!)
- User experience is streamlined and users may feel more comfortable signing up/logging in with a large identity provider.
- All of those nice features like MFA, automatic breach detection and password management are available out of the box!
At this stage you are most likely sold. Developers (Myself included) are lazy by nature and we love to implement already well built solutions to our problems.
Shut up and take my money
Ok you're sold. Better to do some reading on it before hand though. Ill leave some links at the bottom of this post that I found helpful. For those that just want an basic understanding before copy and pasting the quick start code into your project... We all do it.. see below 😂
So lets use Códu as an example (Follow along with the steps to make it easier to understand)
- Open Códu.co and click Sign in
- The option to 'login with GitHub' is provided so GitHub is going to be the external identity provider.
- When you click to sign in with GitHub you are now redirected to a GitHub domain address and a request token generated by Códu is sent. This uniquely identifies this transaction. Pay attention to the url
- 'https://github.com/login?client_id=669b5d44e00c56836b0f&return_to=/login/oauth/authorize?client_id=669b5d44e00c56836b0f&redirect_uri=https://www.codu.co/api/auth/callback/github``'
- Some of the URI is removed and the URI is decoded to make it easier to understand whats happening. There are several different query params in the URI however for this overview, lets focus on 'redirect_uri'
- This tells the external identity provider 'Github' where to redirect users after a successful login. They will be sent to this URI with a verified access token from GitHub.
- This part is a guess but now we hit the Códu backend api/auth/callback/github and using the access token sent from GitHub Códu send another request to Github to pull down the user credentials. Something like
const getUserDetails(accessToken): User
- User is now able to use the Codu app and write suspect blog posts on oAuth 😅
Wrapping up
- I am not an expert at this and as always do your own research before deploying stuff to Prod.
- oAuth is awesome and everyone should use it.
- I am going to follow on this article with some quick start guides to get you going quickly on some of the more popular oauth providers.
