본문 바로가기

programming study/Vue

Vue.js - 토큰

1. 토큰

  • 유저가 유효한 권한을 가지고 있는지를 판별하기 위한 값
    • 401 Error: api를 요청하였을 때, 유저가 유효한 권한이 없을 경우에 발생
  • 주로 로그인 이후에 서버로부터 부여받음
  • JWT
    • JSON Web Token
    • JSON Object로 표현되는 토큰
    • HMAC, RSA 등의 알고리즘에의해 암호화될 수 있음

2. HTTP 헤더에 토큰 값을 싣기

  • axis 인스턴스를 생성할 때, HTTP Header Spec인 Authorization을 지정할 수 있음
    • token을 지정하여 API 호출 시, 권한을 인증
import axios from 'axios';
​
const instance = axios.create({
 baseURL: process.env.VUE_APP_API_URL,
 // HTTP Header Spec
 headers: {
   // token을 실어 보냄
   // API 권한을 확인
   Authorization: 'token',
},
});
​

Reference

Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념