[typescript] 타입스크립트에서의 Superagent 토큰 갱신 및 재발급 메커니즘

22 Dec 2023

typescript

토큰 인증을 사용하는 웹 애플리케이션에서는 토큰의 만료 및 갱신에 대한 메커니즘이 필요하다. TypeScript와 Superagent를 사용하여 이를 구현하는 방법에 대해 알아보자.

Superagent란?

Superagent는 Node.js 및 브라우저에서 사용할 수 있는 HTTP 클라이언트 라이브러리이다. 이 라이브러리를 사용하면 HTTP 요청을 보내고 응답을 받아올 수 있다.

토큰 갱신 및 재발급

토큰의 만료 시간을 고려하여 Superagent를 사용해 API 요청을 보낼 때, 토큰이 만료된 경우에는 토큰을 갱신하고 해당 요청을 다시 보내야 한다. 아래는 이를 구현한 TypeScript 코드의 예시이다.

import superagent from 'superagent';

let accessToken: string = '...'; // 현재 유효한 토큰
const apiUrl: string = 'https://api.example.com/data';

async function sendAuthorizedRequest(url: string, token: string): Promise<any> {
  try {
    const response = await superagent.get(url).set('Authorization', `Bearer ${token}`);
    return response.body;
  } catch (error) {
    if (error.status === 401) { // 401 Unauthorized 에러 발생 시
      const newToken = await refreshAccessToken(); // 토큰을 갱신
      accessToken = newToken; // 갱신된 토큰으로 업데이트
      return sendAuthorizedRequest(url, newToken); // 재귀적으로 요청을 다시 보냄
    }
    throw error; // 다른 종류의 에러는 throw
  }
}

async function refreshAccessToken(): Promise<string> {
  // 토큰 재발급 로직 구현
}

위 코드에서 sendAuthorizedRequest 함수는 Superagent를 사용하여 인증된 요청을 보내는 함수이다. 만약 401 Unauthorized 에러가 발생하면 refreshAccessToken 함수로 토큰을 갱신하고 해당 요청을 다시 보내는 로직을 구현했다.

마무리

타입스크립트와 Superagent를 사용하여 토큰의 갱신 및 재발급 메커니즘을 구현하는 방법에 대해 알아봤다. 이를 통해 안전하고 신뢰할 수 있는 토큰 기반의 인증 시스템을 구축할 수 있을 것이다.

참고: Superagent 문서, TypeScript 문서