[Boiler Plate] (5) 로그인 & Token & Cookie

이서현·2021년 7월 6일
0

nodeJS

목록 보기
5/10
post-thumbnail

이제 회원가입이 완성되었으므로 로그인을 진행한다! 🌷

1. Login router

우선 index.js에 router를 생성한다.

app.post('/api/user/login',(req,res)=>{})

2. Email 찾기

클라이언트에서 요청한 이메일이 데이터베이스에 있는 이메일인지 찾아야 한다.
mongoDB에서 제공하는 함수인 findOne()을 사용한다.
이메일은 모든 사용자가 달라야 하므로 데이터베이스에서 하나의 객체만 나올 것이다.

User.findOne({email:req.body.email}, (err, user)=>{
    // user not found!
    if(!user){
      return res.json({
        loginSuccess : false,
        message : "제공된 이메일에 해당하는 유저가 없습니다."
      })
    }
})

3. 비밀번호 찾기

요청된 이메일이 존재하는 이메일이면 비밀번호를 확인할 차례이다.
comparerPassword라는 메서드를 만들 것이다.
password를 전달하고 isMatch로 비밀번호가 일치하는지 확인한다.

User.findOne({email:req.body.email}, (err, user)=>{
    // user not found!
    if(!user){
      return res.json({
        loginSuccess : false,
        message : "제공된 이메일에 해당하는 유저가 없습니다."
      })
    }
    
    
    user.comparePassword(req.body.password , (err,isMatch)=>{
      if(!isMatch) 
      	return res.json({loginSuccess: false, message:"비밀번호가 틀렸습니다."})
    })
})

comparePassword 메서드는 User.js에서 만든다.
데이터 베이스에 저장된 비밀번호는 암호화 되어 있기 때문에 복호화 해야 한다.
bcrypt에서 제공하는 compare함수로
클라이언트에서 받아온 비밀번호와 유저의 암호화된 비밀번호를 비교한다.
결과는 isMatch로 callback 함수로 전달한다.

userSchema.methods.comparePassword = function (plainPassword, callback) {
    bcrypt.compare(plainPassword,this.password,function(err,isMatch){
        if(err) return callback(err)
        callback(null,isMatch)
    })
}

4. Token 생성

비밀번호가 일치하다면 user의 token을 생성한다.
이번에도 comparerPassword 같이 createToken 메서드를 만들어준다.

      user.createToken((err,user)=>{
        if(err) return res.status(400).send(err)

      })

우선 토큰 생성을 위해 jsonwebtoken 라이브러리를 다운로드한다.

npm install jsonwebtoken --save

설치 후 User.js 파일에 createToken 메서드를 추가한다.
토큰은 user의 id와 "secretToken"으로 만든다.

즉, user._id + "secretToken" = token 이 된다.
"secretToken"을 넣었을 때 user._id 를 알 수 있다.

const jwt = require('jsonwebtoken')

userSchema.methods.createToken=function (callback){
    let user = this

    //jsonwebtoken을 이용해서 토큰생성
    
    let token = jwt.sign(user._id.toHexString(), "secretToken")

    user.token=token
    user.save(function(err,user){
        if(err) return callback(err)

        callback(null,user)
    })
}

만든 토큰을 user 토큰에 입력하고 데이터베이스에 저장한다. 그리고 user의 정보를 callback 함수로 전달한다.

5. 생성된 token을 cookie에 저장 🍪

토큰을 생성하고 cookie에 저장할 것이다. cookie는 사용자 인증과정에서 사용할 것이다!


cookie-parser를 설치한다.

npm install cookie-parser --save
const cookieParser = require('cookie-parser')
app.use(cookieParser())

index.js 파일에서 토큰을 만들고 나서 쿠키에 저장한다.

user.createToken((err,user)=>{
        if(err) return res.status(400).send(err)

        // 토큰을 저장한다. 쿠키나 로컬 스토리지에 저장할 수 있다.
         res.cookie('x_auth',user.token)
         .status(200)
         .json({loginSuccess:true, userId:user._id})

      })
    })

Mongo DB 확인

/login route 전체 코드

app.post('/api/user/login',(req,res)=>{
  // 요청한 이메일을 데이터베이스에서 있는지 찾는다.
  User.findOne({email:req.body.email}, (err, user)=>{
    // user not found!
    if(!user){
      return res.json({
        loginSuccess : false,
        message : "제공된 이메일에 해당하는 유저가 없습니다."
      })
    }
    //요청된 이메일이 있다면 비밀번호가 맞는지 확인
    // 메서드는 user 모델에서 만든다.
    user.comparePassword(req.body.password , (err,isMatch)=>{
      if(!isMatch) return res.json({loginSuccess: false, message:"비밀번호가 틀렸습니다."})

      // 비밀 번호가 맞으면 토큰을 생성
      user.createToken((err,user)=>{
        if(err) return res.status(400).send(err)

        // 토큰을 저장한다. 쿠키나 로컬 스토리지에 저장할 수 있다.
         res.cookie('x_auth',user.token)
         .status(200)
         .json({loginSuccess:true, userId:user._id})

      })
    })
  })
})
profile
안녕하세요. 이서현입니다( ღ'ᴗ'ღ )

0개의 댓글