리액트 심화주차4

[ 인증/인가(쿠키, 세션, 토큰, JWT) ]

▶ 인증&인가

인증(Authentication) vs. 인가(Authorization)

• 인증(Authentication): 서비스를 이용하려는 유저가 등록된 회원인지 확인하는 절차
• 인가(Authorization): 특정 리소스에 접근할 수 있는 권한이 있는지 확인하는 절차

 

http 프로토콜 통신의 특징 2가지

• 무상태 (Stateless): 서버는 클라이언트의 상태를 기억하지 않음
  • 각 요청마다 서버에서 요구하는 모든 상태 정보를 담아서 요청해야 함
• 비연결성 (Connectionless): 서버와 클라이언트는 연결되어 있지 않음 그래서 서버 입장에서는 매번 새로운 요청임
  • 비연결성으로 인해 최소한의 서버 자원으로 서버를 유지할 수 있게 해줌
  • 각 사용자별 요청이 잦은 서비스의 경우 이러한 비연결성은 오히려 비효율적일 수 있음

 

▶ 쿠키, 세션, 토큰

쿠키(cookie)

• 무상태와 비연결성이라는 http통신의 특징에도 불구하고 마치 서버가 클라이언트의 인증 상태를 기억하는 것처럼 구현할 수 있는 수단으로 사용할 수 있음
• 쿠키란 브라우저에 저장되는 텍스트 파일이며 key-value 형태로 저장됨
• 쿠키는 별도로 삭제처리하거나 유효기간이 만료되지 않는 이상 서버와 통신할 때 자동으로 주고 받게 됨
• 서버에 특정 API 요청을 했을 때 서버가 응답 시 header 안에 set-cookie 속성으로 쿠키 정보를 담아주면 응답을 받은 브라우저는 쿠키를 브라우저에 자동으로 저장됨
  • 저장된 쿠키정보는 개발자도구 → 애플리케이션 → 저장용량 → 쿠키 에서 확인 가능
• 서버에 http 요청 할 때 마다 브라우저에 저장되어 있는 쿠키는 자동으로 서버에 보내짐
  • 단 동일한 Origin 또는 CORS를 허용하는 Origin에만 쿠키를 보냄
    • ex) 유튜브 서버에서 받은 쿠키는 유튜브 이용 시에만 주고 받을 수 있음

 

Origin

출처(origin) 이란 protocol + host + port를 의미

 

CORS

쿠키는 클라이언트에서 직접 추가/수정/삭제 할 수 있음

 

세션(Session)

• 세션이란 사용자와 서버 간의 연결이 활성화된 상태를 의미하는 개념
  • 또는 인증이 유지되고 있는 상태
• 로그인 성공 → 서버에서 세션 생성 및 저장(key-value 형식) → key(sessionId)를 브라우저에 응답(by 쿠키)

 

쿠키-세션 인증 방식

• 로그인/회원가입 시 세션 인증
• 로그인/회원가입 성공 시 서버에서 쿠키에 sessionId를 담아서 보내줌
• 세션 유지 상태: 서버에서 관리하는 세션 저장소에 회원 데이터가 있음
• 세션 만료 상태: 서버에서 관리하는 세션 저장소에 회원 데이터가 없음
• 인가(Authorization) 필요한 API 요청/응답
• 서버는 인가가 필요한 API 요청을 받으면 클라이언트 쿠키에 들어 있는 sessionId를 세션 저장소에 조회하여 있으면 DB에 데이터를 조회하여 응답함

 

토큰(token)

• 클라이언트에서 보관하는 암호화된 인증 정보를 의미
• 세션처럼 서버에서 사용자의 인증 정보를 보관할 필요가 없기 때문에 서버 부담을 줄여주는 인증 수단
• 웹에서 인증 수단으로 사용되는 토큰은 주로 JWT (Json Web Token)을 이용

 

JWT의 특징

• header, payload, signature 형식으로 3가지 데이터로 구성되어 있음
• 국제 인터넷 표준 인증 규격 중 하나
• 암호화된 토큰을 누구나 복호화하여 payload를 볼 수 있음
  • 토큰의 용도는 인증정보(payload)에 대한 보호가 아니라 위조 방지
• 정보(payload)를 토큰화할 때 signature에 secret key가 필요함
  • secret key는 복호화가 아니라 토큰이 유효한 지를 검증하는 데 사용됨