Authentication and authorization in public clients like single-page applications can be complicated! We'll walk through the Authorization Code flow with Proof Key for Code Exchange (PKCE) extension to better understand how it works and inspect the auth tokens you get back from the process by spinning up a sample app using Okta. Learn more and follow along with the companion blog post: https://developer.okta.com/blog/2023/04/04/spa-auth-tokens Questions?: https://devforum.okta.com/t/how-authentication-and-authorization-work-for-spas/23861 Table of Contents 00:00 Welcome! Let's dive in! 00:16 Avoiding authentication-related attacks 01:27 Understanding Authorization Code flow with Proof Key for Code Exchange 03:40 Spin up an example application in React 04:38 Peek at the application code 05:51 Run the example application and sign in 06:54 Inspect the network calls from the Authorization Code flow 07:22 Finding the token storage location and look at the access and ID tokens 07:56 See the ID token in action within the application 08:30 See the access token in action within the application 08:59 Thanks for watching! Where to go from here #authentication #authorization #oauth #oauth2 #spa ___________________________________________ Okta is a developer API service that stores user accounts for your web apps, mobile apps, and APIs. * Sign up for Okta for free at https://developer.okta.com/signup/ * For more info, visit us at https://developer.okta.com/ * Developer Blog: https://developer.okta.com/blog/ * Follow us on Twitter: https://twitter.com/oktadev * Follow us on FB: https://www.facebook.com/oktadevelopers/ * Follow us on LinkedIn: https://www.linkedin.com/company/oktadev