인증과 인가, JWT (JSON Web Token)

들어가며

프론트 작업을 하다 보면 사용자에 대한 정보를 이용한 작업이나 확인 여부를 가지고 작업을 하는 경우가 필요한데 클라이언트가 서버를 통해 인증을 확인받는 방법들과 JSON Web Token(이하 JWT) 토큰 인증에 대해서 알아보려 합니다.

인증과 인가

인증과 인가는 각각

인증(Authentication) - 사용자의 신원을 검증하는 행위 ( 비밀번호, 일회용 핀, 인증 앱, 생체인식 등)

인가(Authorization) - 사용자에게 특정 리소스나 기능에 액세스할 수 있는 권한을 부여하는 프로세스

이며, 둘을 간단히 비교하면 다음과 같습니다.

비교인증(Authentication)인가(Authorization)

기능	자격 증명 확인	권한 허가/여부
진행방식	비밀번호, 생체인식, 핀, 앱	보안팀에서 관리하는 설정 사용
사용자가 볼 수 있는가	YES	NO
사용자가 직접 변경할 수 있는가	부분적으로 가능	불가능
데이터 전송	ID 토큰 사용	액세스 토큰 사용

인증 방식 종류

인증 방식에는 크게 3가지가 있는데 Cookie / Session / Token 인증이 있습니다. 각각의 장단점을 한 번씩 정리해보겠습니다.

Cookie 인증

쿠키는 Key-Value 형식의 문자열로 구성되어 있고 클라이언트가 웹사이트를 방문할 때, 사이트가 사용하고 있는 서버를 통해 클라이언트의 브라우저에 설치되는 기록 정보 파일입니다.

* 과정

1. 브라우저가 서버에 요청을 보냅니다.
2. 서버는 클라이언트의 요청에 응답할 때, 클라이언트에 저장하고 싶은 정보를 응답 헤더의 Set-Cookie에 담아 보냅니다.
3. 이후 해당 클라이언트는 요청을 보낼 때마다, 저장된 쿠키를 요청 헤더의 Cookie에 담아 보냅니다.

* 단점

쿠키 방식의 단점은 쿠키값이 그대로 노출되어 있기 때문에 보안에 취약하고 용량 제한이 존재한다는 것입니다. 또한 웹 브라우저마다 형태가 다르므로 공유할 수 없고 사이즈가 커질수록 네트워크 부하가 생기는 것도 문제입니다.

Session 인증

쿠키의 보안 이슈로 세션은 인증 정보를 브라우저가 아닌 서버 측에 저장하고 관리하는 방식입니다. 세션 객체는 키에 해당하는 Session ID와 Value로 구성되어 있고 Value에는 생성 시간, 마지막 접근 시간, 데이터 등이 Map 형태로 저장됩니다.

* 과정

1. 사용자가 로그인하면 세션이 서버상에 저장됩니다.
2. 서버에서 브라우저에 쿠키에 session id를 저장합니다.
3. 브라우저는 사이트에 대한 모든 요청에 session id를 쿠키에 담아 전송합니다. 서버는 session id를 비교하여 인증을 수행합니다.

* 단점

세션 방식의 단점은 Session id 자체를 탈취하여 위장을 할 수 있는 가능성이 있고, 서버에 세션 저장소를 사용하기 때문에 요청이 많아지면 서버 부하가 심해지는 단점이 있습니다.

Token 인증

클라이언트가 접속하게 되면 서버에서 인증되었다는 의미의 토큰을 부여합니다. 이 토큰은 고유하며 클라이언트는 서버에 요청할 때마다 토큰을 같이 보냅니다. 서버에서는 해당 토큰으로 인증 과정을 처리합니다. 세션 인증에서는 세션 정보를 서버에 가지고 있어야 하고 조회하는 과정이 필요하므로 오버헤드가 발생하는데 토큰은 클라이언트에 저장되기 때문에 서버의 부담을 줄일 수 있습니다. 토큰은 앱과 서버가 통신 및 인증할 때 가장 많이 사용하는데 앱은 쿠키와 세션이 없기 때문입니다.

* 과정

1. 사용자가 로그인하면 서버에서 고유한 토큰을 발급합니다.
2. 클라이언트는 전달받은 토큰을 쿠키나 스토리지에 저장하고, 서버에 요청할 때마다 해당 토큰을 HTTP 요청 헤더에 포함해 전달합니다.
3. 서버는 전달받은 토큰을 인증하고 요청에 응답합니다. 토큰에는 요청한 사람의 정보가 담겨있기에 서버는 DB를 조회하지 않고 누가 요청하는지 알 수 있습니다.

* 단점

토큰 방식의 단점은 쿠키/세션보다 데이터 길이가 길고 요청이 많아지면 네트워크 부하가 많아질 가능성이 있고 payload 자체는 암호화가 안돼서 중요한 정보를 담기에는 무리가 있습니다. 또한, 토큰 자체를 탈취당하면 대처하기 어렵습니다.

JWT (JSON Web Token) 이란

JWT는 인증에 필요한 정보를 암호화한 JSON 토큰입니다. 그리고 토큰 인증 방식과 비슷한 과정을 가집니다. JWT는 JSON 데이터를 Base64 인코딩하여 직렬화한 것으로 내부에는 위변조 방지를 위한 개인 키를 통한 전자서명이 존재하는 데 따라서 서버는 서명을 검증하는 과정을 거치고 검증이 완료되면 요청에 대한 응답을 진행합니다.

JWT 구조

JWT는 ' . ' 을 구분자로 세 가지 문자열의 조합으로 이루어져 있습니다.

Header(헤더).Payload(내용).Signature(서명)

헤더 - JWT에서 사용할 타입, 알고리즘의 종류 기재

내용 - 사용자 권한 정보와 데이터

서명 - 헤더에 명시된 해시함수를 적용하고, 개인 키로 서명한 전자 서명이 있음

//Header
{
	"alg": "HS256", // 서명 암호와 알고리즘 ( ex: HMAC SHA256, RSA)
    "typ": "JWT", // 토큰 유형
}

//Payload
{
	"jit": "1234", 						// Registered Claim
    "exp": "162143000000",				// Registered Claim
    "https://story.pxd.co.kr" : true,	// Public Claim
    "username":"jun"					// Private Claim
}

//signature
HMACSHA256(
	base64UrlEncode(header) + "." +
    base64UrlEncode(payload),
    사용자 키 // 유일한 키 값
)

 

Registered claims : 미리 정의된 클레임.

• iss(issuer; 발행자)
• exp(expiration time; 만료 시간)
• sub(subject; 제목)
• iat(issued At; 발행 시간)
• jti(JWI ID)
• Private claims : 해당하는 당사자들 간에 정보를 공유하기 위해 만들어진 사용자 지정 클레임. 외부에 공개돼도 상관없지만, 해당 사용자를 특정할 수 있는 정보들을 담고 있습니다. 헤더와 페이로드는 단순히 인코딩된 값이므로 제삼자가 복호화를 통해 데이터를 확인할 수 있지만 서명은 서버에서 관리하는 비밀키가 유출되지 않는 이상 복호화할 수 없으므로 안전하다고 볼 수 있습니다.
• Public claims : 사용자가 정의할 수 있는 클레임 공개용 정보 전달을 위해 사용한다.

* 과정

1. 로그인 요청을 하면 서버에서 Header, PayLoad, Signature를 정의하고 인코딩 이후 한 번 더 암호화하여 JWT를 만들고 쿠키에 담아 클라이언트에게 보냅니다.
2. 클라이언트는 JWT를 로컬 스토리지 등에 저장하고 API 서버에 요청할 때 헤더에 토큰을 담아 보냅니다.
3. 해당 JWT를 서버에서 일치 여부를 확인하고 인증 여부를 체크합니다. 인증이 성공적으로 완료되면 응답을 보내줍니다.
4. 클라이언트가 서버에 요청했는데 토큰의 기간이 만료된 상태이면 리프레시 토큰을 이용해서 새로운 토큰을 발급합니다.

토큰 인증 신뢰성을 가지는 이유

예를 들어 페이로드를 바꾸었다고 가정하여도 서버는 토큰 안에 들어있는 정보가 중요한 것이 아니고 해당 토큰이 유효한 토큰인지 확인하는 것이 중요하므로 클라이언트한테 받은 JWT의 헤더, 페이로드를 서버의 Key값을 이용해 시그니처 토큰을 다시 만들고 이를 비교해서 일치하면 인증합니다.

* 장단점 정리

	장점	단점
Cookie & Session	Cookie만 사용하는 방식보다 보안 향상, 서버 쪽에서 Session 통제 가능, 네트워크 부하 낮음	세션 저장소 사용으로 인한 서버 부하
세션	인증을 위한 별도의 저장소가 필요없음, 별도의 I/O 작업이 없는 빠른 인증 처리, 확장성이 우수함	토큰의 길이가 늘어날수록 네트워크 부하, 특정 토큰을 강제로 만료시키기 어려움

JWT 장점

1. 데이터 위변조를 막을 수 있다.
2. 인증 정보에 대한 별도의 저장소가 필요 없다.
3. JWT는 검증 정보, 데이터 정보 등 모든 정보를 자체적으로 가지고 있다.
4. 다른 로그인 시스템에 접근 및 권한 공유가 가능하다. (ex. 타 브라우저 등)
5. OAuth의 경우 소셜 계정을 이용하여 다른 웹서비스에서도 로그인할 수 있다.
6. 앱 환경에서도 잘 동작한다.

 

JWT 단점

1. 토큰 자체에 모든 정보를 담고 있으므로 양날의 검이 될 수 있다.
2. 토큰 길이가 길어지면 네트워크에 부하를 줄 수 있다.
3. payload는 인코딩/디코딩만으로 데이터를 볼 수 있으므로 중요데이터를 넣으면 안 된다.
4. 토큰 자체를 탈취당하면 대처가 어렵다.

적용사례

최근 개발 중인 회의실 예약관리 시스템에서 jwt를 간단히 적용해보았는데요. jsonwebtoken 라이브러리를 사용하여 추후 개인화를 위한 계정별 관리의 확장성까지 고려해 구현한 사례입니다.

// 로그인 정보를 받아서 jwt 토큰화 시키기
// 임시 사용자 정보
const user = ‘sample@pxd.co.kr’;

// env 파일에 저장해놓은 jwt 변환할 때 쓰일 비밀 키
const secretkey = process.env.JWT_SECRET_PXD;
const token = jwt.sign({ user }, secretKey);

다음과 같이 헤더를 조정하지 않고 인코딩을 진행하면

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6InNhbXBsZUBweGQuY28ua3IiLCJpYXQiOjE2OTQ2NTQ1NjB9.65mhf22WxnjI-Z1u8gUPtLMXpC4pYeV2qqHJEUCj1OU

이러한 토큰을 생성할 수 있습니다. 이 토큰은 서버가 클라이언트로 응답을 보낼 때 같이 보내주며, 클라이언트는 이 토큰을 가지고 있다가 다른 요청을 보낼 때 헤더에 해당 토큰을 포함하여 전송합니다.

// 클라이언트로부터 받은 jwt를 decode
const decode = jwt.decode(token);
console.log(decode); // json 데이터 출력

const moreDecode = jwt.decode(token, { complete : true });
console.log(moreDecode); // 헤더, 페이로드, 서명까지 모두 포함된 json 데이터 출력

디코딩한 데이터에는 서버에서 처음 세팅해서 내려줬던 정보들을 담고 있는데 서버에서 가지고 있던 secretKey 값 등의 데이터로 비교하여 인증을 처리할 수 있게 됩니다. 또한, 토큰의 만료 시간을 인증하는 로직을 추가하는 것으로 보안성을 더 높일 수 있습니다.

 

마치며

이전에 프론트엔드를 공부할 때 봤던 주제 중에 한 번쯤 정리해보고 싶은 것으로 글을 써보았습니다.

다음에는 더 맛있는 주제를 찾아 더 유익한 글을 써보고 싶습니다.

감사합니다.

 

이글은 pxd XE Group Blog에서도 보실 수 있습니다.

 

 참고문서

•  Session과 JWT에 대해 알아보자, 인증과 인가
•  JWT란 무엇이며 어떤 흐름을 가질까?
•  JWT 토큰 기반 인증에 대한 소개
•  JWT의 개념부터 구현까지 알아보기
•  JWT 토큰 인증 이란?