0Pricing
Vue Academy · Lesson

JWT Authentication: Login and Refresh

Access token + refresh token flow, httpOnly cookies, silent refresh with interceptors.

Access and Refresh Token Model

A robust JWT scheme uses two tokens: a short-lived access token (minutes) sent with every API request, and a long-lived refresh token (days) used only to mint new access tokens. This limits exposure if an access token leaks.

Registering the JWT Plugin

With Fastify, register @fastify/jwt and provide a strong secret. It adds signing and verification helpers to the app and request objects.

import jwt from '@fastify/jwt'

await app.register(jwt, {
  secret: process.env.JWT_SECRET
})

All lessons in this course

  1. Fastify Backend for Vue SPAs
  2. JWT Authentication: Login and Refresh
  3. Authenticated API Calls with Axios Interceptors
  4. Deploying Full-Stack Vue to Production
← Back to Vue Academy