Node.js로 회원가입 하기(비밀번호 암호화) 6

🙋‍♂️1. Node.js로 5분만에 API 만들기
🙋‍♂️2. Node.js로 POST API 만들기
🙋‍♂️3. Node.js로 데이터 저장하기
🙋‍♂️4. Node.js에 저장된 데이터에 인덱스 붙이기, 데이터 삭제하기
🙋‍♂️5. Node.js로 세션 방식 로그인 구현하기
이번에는 미뤄뒀던 회원가입 기능을 구현해보자. 비밀번호 암호화 하는 방법도 함께 알아보겠다. 암호화에는 단방향 해시함수 bcrypt를 사용할 예정이다.

사전 준비 1 : 라이브러리 설치

1	`npm install bcrypt`

이번에도 새로 라이브러리를 설치해야 한다. bcrypt를 설치하자.

사전 준비 2 : 설치한 라이브러리 require

const bcrypt = require('bcrypt');

이전과 마찬가지로 설치한 라이브러리를 사용하려면 server.js 상단에 이렇게 선언을 해주어야 한다.

사전 준비 3 : join.ejs 파일 만들기

앞에 쓴 거랑 너무 똑같아서 그냥 생략해도 될 것 같지만 일단 쓴다. join.ejs파일을 만들어서 /join으로 id와 pw를 전송할 수 있도록 해주자.

<body>
    <%- include('nav.html') %>
    <div class="container mt-5">
      <form action="/join" method="POST">
        <h3>Join</h3>
        <div class="form-group">  
          <h5 class="mt-4">아이디</h5> 
          <input class="form-control form-control-sm" type="text" placeholder="id" name="id">
        </div>
        <div class="form-group"> 
          <h5 class="mt-4">비밀번호</h5>
          <input class="form-control form-control-sm" type="password" placeholder="password" name="pw">
        </div>
          <button type="submit" class="btn btn-primary" data-toggle="button" aria-pressed="false">
          저장하기
        </button>
      </form>
    </div>
    (...)
</body>

개발 1 : 라우터 작성 & 회원가입 로직 구현

GET, POST 방식 호출 모두 작성해준다. POST로 id와 pw를 보낼 때는 아래의 절차를 거쳐야 한다. 아이디 중복 여부 확인 -> 비밀번호 암호화 -> DB에 저장. 실패했을 때는 에러 메시지를 리턴하도록 했다. bcrypt.hash(pw, 10)의 hash 강도는 10으로 설정했는데 보통 10-12 정도로 설정한다.

app.get('/join', function(요청, 응답){
    응답.render('join.ejs'); 
})

app.post('/join', async (req, res) => {
    try {
        const { id, pw } = req.body;

        // 1️⃣ 이미 존재하는 아이디인지 확인
        const existingUser = await db.collection('login').findOne({ id });
        if (existingUser) {
            console.warn('⚠️ 이미 존재하는 아이디입니다:', id);
            return res.status(400).send('이미 존재하는 아이디입니다.');
        }

        // 2️⃣ 비밀번호 암호화
        const hash = await bcrypt.hash(pw, 10); // 두 번째 인자 10 → 해시 강도 (saltRounds)

        // 3️⃣ DB에 저장
        const result = await db.collection('login').insertOne({ id, pw: hash });
        console.log('✅ 회원가입 완료:', result);

        res.redirect('/'); // 회원가입 후 홈으로 이동
    } catch (error) {
        console.error('❌ 회원가입 실패:', error);
        res.status(500).send('회원가입 실패!');
    }    
});

개발 2 : 로그인 시 암호화 된 값 비교하도록 수정

기존 코드에는 바로 pw를 평문 대조하도록 되어 있었지만 이제 암호화 된 값끼리 비교해야 한다. 따라서 로그인 부분 구현에서 작성해두었던 코드를 아래와 같이 수정해주자.

passport.use(new LocalStrategy({
    usernameField: 'id',
    passwordField: 'pw',
    session: true,
    passReqToCallback: false,
}, async function (입력한아이디, 입력한비번, done) {
    try {
        const 결과 = await db.collection('login').findOne({ id: 입력한아이디 });
        if (!결과) {
            return done(null, false, { message: '존재하지 않는 아이디입니다.' });
        }

        // 비밀번호 비교 → bcrypt.compare() 사용
        const isMatch = await bcrypt.compare(입력한비번, 결과.pw);
        if (isMatch) {
            return done(null, 결과); // 로그인 성공
        } else {
            return done(null, false, { message: '비밀번호가 틀렸습니다.' });
        }
    } catch (error) {
        return done(error);
    }
}));

이제 비밀번호를 암호화 해서 회원가입을 하고, 암호화 된 값끼리 비교해서 로그인을 시킬 수 있다.