[TIL/22일차] JWT / 비밀번호 암호화

오늘의 코딩테스트

풀이

https://ezez99.tistory.com/38

[프로그래머스/JS] 최대공약수와 최소공배수

오늘의 학습/한일

Cookie/Session

JWT

bcrypt

게시판 프로젝트 시작 및 회원가입 기능

 

●Cookie 와 Session

쿠키(Cookie)란?

- 서버가 클라이언트의 HTTP 요청(Request)을 수신할 때, 처음 쿠키를 수신(Response)하게 됩니다. 그러면 쿠키의 정보를 클라이언트가 가지게 되고, 해당하는 쿠키의 값이 서버에 저장이 되게 되고 해당하는 쿠키를 요청하면 서버는 저장된 쿠키의 정보 값을 전달하여 줍니다.

 

세션(Session)이란?

- 쿠키의 경우 서버를 재시작하거나 새로고침을 하더라도 로그인이 유지됩니다. 이는 사용자에게는 편리하지만, 서버의 입장에서는 보안 문제가 발생할 수 있습니다. 왜냐하면 쿠키가 조작되거나 노출된다면 해당 권한을 탈취당해, 악의적인 공격을 받을 수 있게 되는 것이기 때문입니다.

이러한 약점을 보호하기 위해서 사용자가 누구인지 확실하게 구분할 수 있는 정보를 넣어주어야 할 것입니다. 그래야 민감한 정보는 서버에서만 관리하고, 사용자 식별 정보를 통해 사용자의 정보를 반환할 수 있게하기 위해 만들어 진 것이 Session이란 개념입니다. 쉽게 말해 서버에 요청할 때 Session Key를 전달하면 해당하는 정보를 response하게 되게끔 하는 것입니다.

 ●JWT

 

JWT란?

- JWT(Json Web Token)은 웹 표준으로써, 서버와 클라이언트 사이에서 정보를 안전하게 전송하기 위해 도움을 주는 웹 토큰(Web Token)입니다.

JWT의 특성

1. JWT는 비밀 키를 모르더라도 복호화(Decode)가 가능합니다.
   • JWT를 가진 사람이라면 누구나 해당 토큰에 어떤 데이터가 담겨있는지 확인할 수 있습니다.
   • 변조만 불가능 할 뿐, 누구나 복호화하여 보는것은 가능하다는 의미가 됩니다!
2. 민감한 정보(개인정보, 비밀번호 등)는 담지 않도록 해야합니다.
   • JWT의 페이로드는 누구나 복호화하여 볼 수 있기 때문입니다.
3. JavaScript와 같이 특정 언어에서만 사용 가능한것은 아닙니다!
   • JWT는 단순히 데이터 형식일 뿐, 단지 개념으로서 존재하고, 이 개념을 코드로 구현하여 공개된 코드를 우리가 사용하는게 일반적입니다.

●bcrypt

bcrypt란?

비밀번호나 주민등록번호 같은 정보들은 절대 남들에게 보여줘서는 안되는 정보들이다.

이러한 정보들이 새어나가지 않게 하기 위해서 막아둔 암호화 기술이 bcrypt이다.

bcrypt.hash(정보, 몇번암호화할건지); 의 방식으로 사용된다.

암호화 예시)

import bcrypt from 'bcrypt';

    const hashedPassword = await bcrypt.hash(password, 10);

    const user = await prisma.users.create({
        data: {
            email, 
            password: hashedPassword,
        }

복호화 예시)

const result = await bcrypt.compare(password, hashedPassword);

console.log(result); // true

●게시판 프로젝트 시작 및 회원가입 기능

게시판 프로젝트를 강의를 보면서 시작하였다.

간단한 프로젝트 초기화 방법 순서를 서술해보고자한다.

 

1) 터미널에 작성

# 프로젝트를 초기화합니다.
yarn init -y
# 라이브러리를 설치합니다.
yarn add express prisma @prisma/client cookie-parser jsonwebtoken bcrypt
# nodemon 라이브러리를 DevDependency로 설치합니다.
yarn add -D nodemon
# 설치한 Prisma를 초기화 하여, Prisma를 사용할 수 있는 구조를 생성합니다.
npx prisma init

 

2)package.json변경

"type": "module",

  "scripts": {

    "dev": "nodemon src/app.js"

  },

 

3).env 파일의 정보와 schema.prisma의 datasource db의 provider정보 변경

 

등으로 게시판 프로젝트 기능을 추가했고, 해당하는 소스내용들은 추후 프로젝트 소개로 소개해야겠다!