JWT 3

[Axios] interceptors 적용 - 토큰 재발급

저번 포스팅에서 retryFetch라는 메서드를 만들어서 요청을 보내고, response의 status를 확인해 토큰을 재발급했다.const retryFetch = async ( url: string, options: RequestInit): Promise => { const response = await fetch(url, options); if (response.status === 401) { // status === 401 : Unauthorized 토큰 갱신 const refreshResponse = await fetch( `${process.env.NEXT_PUBLIC_SERVER_URL}/auth/refresh-token`, { method: "..

프로젝트 2024.12.10

[JWT] Refresh Token 적용 - 401 Unauthorized 해결

서버에 로그인 후 response를 확인해 보니 accessToken과 refreshToken이 반환 되었다refreshToken은 뭔지 모르겠으니 일단 패스하고, accessToken으로 데이터 요청하자.const postArticleComment = async ({ id, content,}: PostCommentInterface): Promise => { try { const response = await fetch( `${process.env.NEXT_PUBLIC_SERVER_URL}/articles/${id}/comments`, { method: "POST", headers: { "Content-Type": "applicatio..

프로젝트 2024.12.08

[JWT] Refresh Token이란?

JWT 토큰을 사용할 때 Access Token만 사용하는 경우 많은 문제가 발생합니다. 이를 해결하기 위해 Refresh Token을 사용하는데요, Refresh Token은 보안과 관련된 핵심 개념 중 하나로, 특히 인증이 필요한 웹 애플리케이션에서 자주 사용됩니다. 목차 1. JWT 토큰이란? 2. Access 토큰만 사용하는 경우 문제점 3. Refresh Token이란? 4. Refresh Token 탈취 위험추천글위의 목차를 클릭하면 해당 글로 자동 이동 합니다. 1. JWT 토큰이란?JWT(JSON Web Token)는 클라이언트와 서버 간 인증 및 정보 교환을 위한 토큰 기반 인증 방식입니다. JWT는 간단하고 효율적이며, 다양한 애플리케이션에서 널리 사용됩니다.   JWT.IOJSON W..