앞서 회원가입에서 비밀번호를 입력하고 서버에 보내면 비밀번호가 다음과 같이 그대로 노출된다.

보안에 취약하다...!

비밀번호만 암호화하는 기능을 추가할 것이다!🌷

먼저 Register router를 보면...

app.post('/api/user/register',(req,res) => { 
  // 회원 가입 할때 필요한 정보들을 client 에서 가져오면
  //그거를 데이터 베이스에 넣어 준다.
  const user = new User(req.body);
  user.save((err,userInfo) => {     // mongdb command
      if(err) return res.json({ success: false,err})
  
      return res.status(200).json({ success: true })
  
    })
  })

User 정보를 client에서 받아오고
user.save로 데이터베이스에 넣어준다.

user 정보를 client에서 받아오면 데이터베이스에 저장하기 전에!
비밀번호를 암호화해서 데이터베이스에 넘겨줄 것이다.✨🐰

userSchema.pre('save',function( next ){

})

User.js 파일에서 메서드를 생성한다. save() 를 실행하기 전에 실행한다.

1. Install bycrpt

bycrpt는 password hashing 함수이다.
비밀번호를 암호화하는 함수이다.

bycrpt를 설치한다.

npm install bycrpt --save

2. Salt를 생성

User 모델에 bcrypt와 saltRounds를 추가한다.

const bcrypt = require('bcrypt')
const saltRounds = 10

bcrypt의 genSalt 함수로 salt를 생성한다.
salt는 암호를 hash하는데 사용된다.

3. Salt를 이용해서 hash password를 만들기

생성된 salt와 user의 비밀번호를 bcrypt.hash 함수로 전달한다.
사용자의 비밀번호에 hash가 들어간다.

next() 함수는 클라이언트에서 정보를 받고 DB에 넣기 전에 멈추고 암호화를 시작했으므로 암호화가 끝나면 계속해서 진행하도록 하는 함수이다.

bcrypt.genSalt(saltRounds,function(err,salt){
            if(err) return next(err)
    
            bcrypt.hash(user.password, salt, function(err,hash){
                if (err) return next(err)
    
                user.password=hash
                next()
            })
        })

4. 암호화 기능 조건 분기처리

유저가 개인 정보를 변경할 때마다
비밀번호를 계속 다른 암호로 암호화할 필요가 없다.

따라서 비밀번호를 생성하거나 변경할 경우만
비밀번호 암호화를 진행한다.

userSchema.pre('save',function( next ){
    let user = this

    //비밀번호를 생성, 변경할 경우만 암호화 시킨다.
    if(user.isModified('password')){
        // 비밀번호를 암호화 시킨다.
        bcrypt.genSalt(saltRounds,function(err,salt){
            if(err) return next(err)
    
            bcrypt.hash(user.password, salt,function(err,hash){
                if (err) return next(err)
    
                user.password=hash
                next()
            })
        })
    }
    // 비밀번호를 변경하지 않는 경우
    else{ 
    	// 바로 다음 단계로 넘어간다.
        next()
    }

})

Mongo DB 확인

사진처럼 암호화된 모습을 볼 수 있다!!🌷🐰