Web Dev/ELICE

35 (1/2) :: JWT, Cookie, 비밀번호 찾기 흐름, OAuth, 구글로그인, Nginx

HJPlumtree 2021. 12. 11. 11:00

엘리스 SW 엔지니어 트랙 35일차

온라인 강의날 🦁

 

 

JWT

Json Web Token

인증 위한 정보를 저장소 이용안하고

전자 서명 이용해서 확인하는 방법

 

구성

header: 토큰의 타입

payload: 전달되는 데이터

signature: 헤더와 페이로드의 전자서명

 

payload

단순히 정보를 base65 인코딩한것

=> decode시 정보 노출

=> 민감한 정보 제외하고 토큰 생성 필수

 

서버는 JWT 생성할 때 비공개키 이용 서명

payload 조작시 서명이 달라서 인증 실패

 

JWT 작동 반식

  1. 사용자 로그인
  2. 서버는 로그인된 유저 정보를 JWT로 생성 클라이언트에 전달
  3. 클라이언트는 전달받은 JWT 이용 인증이 필요한 요청에 사용
지금까지 session 사용했다
session은 웹 브라우저 통신 스펙
모바일 등 웹 브라우저가 아닌 앱에는 부적합
=> JWT 사용하면 어느 클라이언트나 동일하게 사용자 인증 구현

 

JWT 공식 홈페이지

링크 => https://jwt.io/

 

 

Cookie

웹에서 사용하는 정보를 클라이언트에 저장

HTTP요청시 함께 전송

클라이언트 정보 서버에 전단하는 기술

 

Session vs Cookie

  • Session: 클라이언트 정보 서버 측 저장소에 저장
  • Cookie: 클라이언트 정보 클라이언트(브라우저)에 저장

 

JWT + Cookie

앞에서 배운 Session 사용해서 로그인한 경우

Cookie에 Session ID 저장하고,

Session Store에서 유저 정보 가져왔다

 

JWT를 쿠키에 저장하면

JWT로 요청하고 올바른지(서명) 확인 후 유저 정보 사용한다

=> 데이터베이스 접근 줄어서 효율적 인증 구현

 

JWT 로그인 구현

  1. 기존 세션 로그인 비활성화
  2. 로그인 로직에서 JWT 생서하고 쿠키로 전달
  3. passport-jwt 패키지로 JWT 로그인 미들웨어 작성

 

 

회원 비밀번호 찾기

비밀번호 초기화 흐름

  1. 임의의 문자열 비밀번호 초기화
  2. 초기화된 문자열 메일로 전달(메일 발송기능 필요)
  3. 초기화 후 첫 로그인시 비밀번호 변경 요청

 

메일 발송 기능 구현 방법

1. SMTP 서버 이용

네이버, 구글 등 메일 서버 이용 무료 발송

메일 발 송 및 관리 직접 개발 필요

 

2. 메일 발송 서비스 시용

Mailgun, Sendgrid 등

메일 발송 api 제공 및 관리용 웹페이지 제공

 

Simple Mail Tranfer Protocol(SMTP)

메일 전송해주는 서버

 

SMTP 서버 직접 만들고 운영하는 것 비효율

Nodemailer 패키지 이용해서 SMTP 서버 통해 메일 발송

 

Nodemailer + Gmail 사용

Nodemailer에서 Gmail 사용하려면 앱 비밀번호 설정 필요

구글 계정 => 보안 => 앱 비밀번호 추가

(앱 비밀번호 다시 확인 X, 기록 필수)

 

 

OAuth

Open Authorization

서비스 제공자가

다른 서비스에게 데이터를 제공하기 위해

서비스 사용자에게 제공하는 사용자 인증방식 표준

 

OAuth 동작 방식

  1. 서비스 제공자에게 인증 요청
  2. 인증 완료 후 사용자 정보 요청한 서비스로 전달
  3. 인증 정보 이용해서 서비스 제공자의 데이터 사용

 

구글 캘린더 연동 서비스

  1. 구글 OAuth 인증 요청
  2. 구글은 OAuth Token을 보내준다
  3. 받은 OAuth Token으로 구글 캘린더 사용하도록 구글에 요청하고 사용

 

OAuth + 로그인

로그인 기능 간편하게 구성 가능

아이디, 비밀번호 로그인 구현 필요 X

사용자는 로그인 시 아이디, 비밀번호 입력 필요 X

 

 

구글 로그인

구글 로그인구현 순서

  1. 구글 클라우드 플랫폼 프로젝트 생성
  2. API 및 서비스 => OAuth 동의화면 설정
  3. 사용자 인증정보 => OAuth 클라이언트 ID 만들기
  4. passport-google-oauth20 연동

passport-google-oauth20 이용하면 쉽게 구글 로그인 붙일 수 있다

 

 

Nginx

최근 가장 많이 채택되는 웹 서버 소프트웨어

Apache 사용했는데 요즘 이건 사용한다고 한다

 

웹 서버 소프트웨어

HTTP 요청 받아

파일/프로그램 실행 결과 HTTP 응답으로 보내주는 소프트웨어

 

Nginx 사용하는 이유

Node.js 기본적으로 HTTP 요청 수신, 응답 기능 있다

=> 웹 서버 소프트웨어 없어도 동작 가능

 

하지만 HTTPS, 도메인 연결, static file caching 등

Node.js 단독으로 production-level 서비스 구축할 수 없다

 

Nginx + Node.js

reverse-proxy 기능 연결

HTTP 요청은 무조건 Nginx가 처리

 

Nginx + Node.js 설정 파일 예시

Nginx configuration 예시

링크 => https://www.nginx.com/nginx-wiki/build/dirhtml/start/topics/examples/full/