Sign Up to Track Progress

AdonisJS 6 Access Token Authentication in 20 Minutes

In this lesson, we'll cover how to implement access token authentication, using opaque tokens, in AdonisJS 6. We'll also take a look at what this would look like on the frontend via a Vue 3 app using Pinia

Published
May 21
Duration
20m 7s

Developer, dog lover, and burrito eater. Currently teaching AdonisJS, a fully featured NodeJS framework, and running Adocasts where I post new lessons weekly. Professionally, I work with JavaScript, .Net C#, and SQL Server.

Adocasts

Burlington, KY

⏰ Chapters
00:00 - Creating Our AdonisJS 6 Project
00:50 - Creating Our Vue 3 Project
01:20 - Opening Our Projects
01:50 - Setting Up Our AdonisJS 6 Project
03:00 - Creating Our Auth Controller & Validator
03:17 - Defining Our Register & Login Validators
04:53 - Registering A User
05:55 - User Access Tokens Provider
06:40 - Logging In A User
07:40 - Logging Out A User
08:28 - Getting An Authenticated Users Details
08:56 - Defining Our Auth Routes
10:13 - Creating A Register Page & Form
11:17 - Creating A Login Page & Form
11:34 - Defining Register & Login Page Routes
11:50 - Creating An Auth Pinia Store
12:55 - Creating An API Helper Function
14:25 - Authenticating A User In Our Pinia Store
14:49 - Auth Store Login & Register Methods
15:18 - Auth Store Logout Method
15:40 - Auth Store Get User Details
16:06 - Register & Login A User On Form Submit
17:02 - Auth User Details & Logout Form
18:10 - Testing Our Authentication Flow

Join The Discussion! (6 Comments)

Please sign in or sign up for free to join in on the dicussion.

  1. Commented 6 days ago

    Thank you very much for the clear and detailed explanation!
    I wonder whether should be a good idea to add token expiration protection in front-end level, or rely on 409 server response in order to delete the token.

    1

    Please sign in or sign up for free to reply

    1. Commented 4 days ago

      The expiry time should be included with the initial token, so you could store it as well on your client and check it every once in a while to see if time is running up. I would rely on the server though for actually discerning whether it's expired or not.

      1

      Please sign in or sign up for free to reply

  2. Commented 6 days ago

    Awesome Tutorial! Thank you.
    Just one thing: I get this error:
    ```
    Property 'currentAccessToken' does not exist on type 'never'
    ```

    1

    Please sign in or sign up for free to reply

    1. Commented 4 days ago

      Thanks Shahriar!

      I would say to try restarting your text editor, sometimes it fails to pick up type changes. Apart from that, make sure your auth is configured correctly and double-check to make sure accessTokens is on your user model:

      static accessTokens = DbAccessTokensProvider.forModel(User)
      Copied!

      If you're still having issues, please share a link to the repo or a repoduction and I can see if anything stands out!

      0

      Please sign in or sign up for free to reply

  3. Commented 4 days ago

    Another question - how do you combine an access-token authentication with social authentication?
    https://docs.adonisjs.com/guides/authentication/social-authentication

    1

    Please sign in or sign up for free to reply

    1. Commented 4 days ago

      Social Auth with AdonisJS forms the connection between AdonisJS and the 3rd party service and gives you the tools to discern who a user is. You can then use that info to create a user inside your application. From there, auth is done normally inside AdonisJS.

      0

      Please sign in or sign up for free to reply