본문 바로가기
내마음대로만들어보자/React 프로젝트 만들기 이해

[React] 토큰기반인증

by 소농민! 2021. 11. 22.
728x90

1. OAuth 란?

외부서비스의 인증 및 권한부여를 관리하는 프레임워크

Open Authentication, Open Authorization (인증과 허가를 포함)

 

* OAuth 인증방식 (간단한 경우)

- 클라이언트 와 서비 사이에 인증(로그인)을 하면 서버가 access_token 을 준다.

- 클라이언트는 access_token을 이용해서 API 요청을 할 수 있다.

- 서버는 API 요청을 받고, access_token을 가지고 권한이 있거나 없나 확인해서 결과를 클라인트에 보내준다.

 

* OAuth 동작 방식(외부 서비스 관련 있는경우)

유저가 구글 로그인을 하는 상황이라고 가정해본다면, 구글은 유저의 정보도 가지고 있을거고 로그인을 검증도 해볼것이다.

구글은 Resource Server(자원 서버) + Authorization server(권한 서버)

유저는 그 정보를 가진 사람이니 Resource Owner(자원 소유자)라고 부른다. (유저 정보는 Resource(자원)이라고 부른다.)

 

- 유저가 구글 로그인을 한다. (자원 소유자가 자원서버에 권한 요청을 한것)

- 구글은 로그인할 때 유저가 입력한 정보(아이디,비밀번호 등)을 보고 클라이언트에 접근 권한을 준다.

- 클라이언트는 이 권한을 가지고 Authorization server(권한 서버)에 access_token을 요청한다.

- 클라이언트는 이 access_token을 가지고 구글에서 유저정보를 가져올 수 있다.

- 구글은 클라이언트가 보낸 access_token을 가지고 권한이 있나 없나 확인해서 결과를 클라이언트에 보내준다.

    (참고로, 클라이언트는 우리 웹사이트를 말한다.)

 

2. JWT (Json web Token)

토큰의 한 형식이며, 데이터가 JSON형태로 이루어져 있는 토큰이다.

 

* 생김새

 [header].[payload(내용)].[signature(서명)]

- header : 토큰 타입과 암호화 방식 정보가 들어간다.

- payload : 토큰에 담을 정보가 name:value 쌍으로 들어간다.

- signature : 서명 정보이다. secret key를 포함해서 header 와 payload 정보가 암호화 되어 들어간다. 

 

* 동작방식

- 유저가 로그인을 시도

- 서버가 요청을 확인하고 secret key를 가지고 access_token을 발급

- 클라이언트에 JWT를 전달하고

- 클라이언트는 API요청을 할 때 Authorization header에 JWT를 담아서 보낸다.

- 서버는 JWT의 서명을 확인하고 payload에서 정보를 확인해서 API 응답을 보낸다.