[JavaScript, Node.js] 유튜브 클론 정리 7장 (1) - Create Account

머리글

이번 시간에는 계정 생성을 해보자.

 

유저 스키마 생성

우선 유저의 정보를 담은 스키마를 생성하자.

import mongoose from "mongoose";

const userSchema = new mongoose.Schema({
  email: { type: String, required: true, unique: true },
  username: { type: String, required: true, unique: true },
  password: { type: String, required: true },
  name: { type: String, required: true },
  location: String,
});

const User = mongoose.model("User", userSchema);
export default User;

비디오 스키마와 유사하게 만들면 되는데 새로 사용한 것은 'unique'다.

unique로 지정을 해놓게 되면
이미 데이터베이스에 이미 같은 내용이 존재하면 생성이 불가능해진다.
회원가입 시, ID 중복 확인과 같은 경우라고 생각하면 된다.

그리고 간단하게 회원가입 제출 양식도 만들어보자.

block content
    form(method="POST")
        input(placeholder="Name", name="name", type="text", required)
        input(placeholder="Email", name="email", type="email", required)
        input(placeholder="Username", name="username", type="text", required)
        input(placeholder="Password", name="password", type="password", required)
        input(placeholder="Location", name="location", type="text", required)
        input(type="submit", value="Join")

그리고 post 요청에 맞는 라우터도 생성을 하자.

export const postJoin = async (req, res) => {
  const { name, username, email, password, location } = req.body;
  await User.create({
    name,
    username,
    email,
    password,
    location,
  });
  return res.redirect("/login");

그런데 지금 확인해 보면,
비밀번호가 그대로 저장되고 있다.

이는 보안상 매우 좋지 않으므로 암호화를 해서 저장하도록 변경해 보자.

비밀번호 암호화

우리는 'bcrypt'를 통해서 비밀번호를 해시화 할 수 있다.

해시란 평문을 암호화된 문장으로 만들어주는 기능이다.
우선 예시를 보면서 진행하기 위해 bcrypt를 설치해 보자.

npm i bcrypt

그리고 해시가 어떻게 진행되는지 한 번 알아보자.

https://emn178.github.io/online-tools/sha256.html

SHA256 Online

여기서 쉽게 해시가 어떻게 되는지 볼 수 있다.

우선 아무거나 하나 입력을 해보면 된다.
그러면 이런 식으로 변환이 된다.

입력값에 따라 계속 해시값이 변화하는 걸 볼 수 있다.

bcrypt는 이 기능을 우리의 프로그램에서 실행해 주는 역할을 한다.

이제 기능을 적용해 보자.

이전에 우리는 pre를 사용하여 저장 전에 무언가 다른 행동을 할 수 있는 middleware의 개념에 대해서 배웠다.
이를 사용해서 해시화를 진행할 수 있다.

유저 스키마의 아랫부분에 다음을 추가해 주자.

userSchema.pre("save", async function () {
  this.password = await bcrypt.hash(this.password, 5);
});

여기서의 this는 유저 스키마를 의미하고,
따라서 this.password는 유저 스키마의 password를 의미한다.

bcrypt의 hash()라는 함수를 이용해서 암호화를 진행하는데,
기존 암호를 this.password로 받아오고,
뒤의 숫자 5는 암호화를 몇 번 할 것인지를 의미한다.

암호화된 문장을 다시 암호화하는 것이다.
5번 진행되어야 하므로,
원문 -> 암호화 1 ->... -> 암호화 4의 순으로 진행된다.

이런 식으로 변경하고 유저를 생성해 보면,
비밀번호가 암호화되어 저장된 것을 볼 수 있다.

마무리

이번 시간에는 계정을 생성해 보고 bcrypt를 통해 암호화해보았다.

다음 시간에는 중복되는 계정의 생성을 방지해 보자.