2018, February 20th
Winds is what I usually refer to as a "big hairy web app" - usually a single-page app, decoupled API, lots of complex frontend state management.
Authentication is the act of verifying that a user is who they claim to be - e.g., Ken Hoff is a twentysomething-year-old (hah) male with blonde hair and blue eyes, and the ID that he's carrying proves that with at least 6 bits of certainty.
Authorization is the act of verifying that a given user has permission to perform a certain action (view this page, update this document, etc) - e.g., the user Ken Hoff is authorized (with confidential double top-secret clearance) to send the launch codes. or something.
When I started on the project, JWTs were stored in localStorage (not cookies), and all of the authentication components were bundled as part of the big hairy web app. It would have been better to send the auth token as part of the initial HTTP request (by storing it in the browser cookie storage) and decouple the auth components from the main app components, but I was working within existing constraints and Captain Hindsight wasn't around that day.
We wanted a bunch of different authentication behaviors in the web app:
Yikes. Lotta cyclomatic complexity there! That's alright though - I was able to get it done in a pretty reasonable way. (hint: creating an
AuthedRoute component and mirroring standard
Route behavior.) There's still a bunch of features that I'd like to see added to it - like checking for auth before serving the bundle and splitting the auth components, or deep linking.
I felt pretty clever about the whole thing, so I decided to put together a quick talk describing how I did it, and presented at the February BoulderJS meetup.
Huge thanks to Madison Kerndt and the rest of the BoulderJS crew for letting me crash their meetup!