Vue/Vuex Typescript example: JWT Authentication

For more detail, please visit:

Vue/Vuex Typescript: JWT Authentication example

(normal version) Vue.js JWT Authentication with Vuex and Vue Router

Fullstack with Spring Boot Back-end:

Spring Boot + Vue.js: Authentication with JWT & Spring Security Example

Fullstack with Node.js Express Back-end:

Node.js Express + Vue.js: JWT Authentication & Authorization example

Fullstack CRUD:

Vue.js + Node.js + Express + MySQL example

Vue.js + Node.js + Express + PostgreSQL example

Vue.js + Node.js + Express + MongoDB example

Vue.js + Spring Boot + MySQL/PostgreSQL example

Vue.js + Spring Boot + MongoDB example

Vue.js + Django example

Note:

Open src/services/auth-header.js and modify return statement for appropriate back-end.

export default function authHeader() {
  const storedUser = localStorage.getItem('user');
  let user = JSON.parse(storedUser ? storedUser : "");

  if (user && user.accessToken) {
    return { Authorization: 'Bearer ' + user.accessToken }; // for Spring Boot back-end
    // return { 'x-access-token': user.accessToken };       // for Node.js Express back-end
  } else {
    return {};
  }
}

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your tests

npm run test

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.