WEB 만들기 10,11 - 로그인 기능 만들기
본문 바로가기
WEB

WEB 만들기 10,11 - 로그인 기능 만들기

by KyeongMin 2021. 1. 18.
728x90
반응형

로그인 만들려면 그 공간을 만든다고 생각합시다. 그것이 라우터 이고 그것은 

index.js 부분에서 하기 전에 생각해보면 우리가 지금 비밀번호를 암호화 했기때문에 

그 암호화된것과 입력된 비번과 비교를 해야합니다. 

 

    userSchema.methods.comparePassword=function(plainPassword,cb){
        //painPassword 1234567  암호화된 비밀번호 "$2b$10$LnOrbKhg...
        //이두개가 맞는지 확인하는 과젖이 필요하다.
        bcrypt.compare(plainPassword,this.password, function(err,isMatch){
            if(err) return cb(err),
            cb(null,isMatch)

        })
    }

 

 

 

우선은 저렇게 User.js 부분에 아래에 써주시면 됩니다. 그리고 index.js부분에서 

 

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

 

토큰을 생성하려면 또 라이브러리가 필요합니다. 아래 명령어를 입력해주세요.

npm install jsonwebtoken --save

www.npmjs.com/package/jsonwebtoken

 

jsonwebtoken

JSON Web Token implementation (symmetric and asymmetric)

www.npmjs.com

이 공식문서를 참고해서 보면은

 

아래 내려보면 이부분을 이용할것입니다., 

그부분 역시 User.js 부분에 만들어야합니다. 

 

        user._id+'secretToken' = token

        ->

        'secretToken' -> user.id;

 

User.js 부분에 이렇게 생성해주고

  userSchema.methods.comparePassword=function(plainPassword,cb){
        //painPassword 1234567  암호화된 비밀번호 "$2b$10$LnOrbKhg...
        //이두개가 맞는지 확인하는 과젖이 필요하다.
        bcrypt.compare(plainPassword,this.password, function(err,isMatch){
            if(err) return cb(err),
            cb(null,isMatch)

        })
    }


    userSchema.methods.generateToken =function(cb){

        var user = this;
        //jsonwebtoken을 이용해서 token을 생성하기
        var token = jwt.sign(user.id.toHexString(),'secretToken')
        user.token = token
        user.save(function(err,user){
            if(err) return res.cb(400)
            cb(null,user)

        })
    }

 

저렇게 토큰을 만들고 비밀토큰이 들어오면 아이디를 알수 있는것입니다. 

그리고 우선 토큰을 저장을 위해서 여러가지가 있다. 쿠키에 저장하냐 로컬스토리지냐, 세션 스토리지냐 논란이 많다 여기서는 쿠키에서 하겠습니다. 

 

그래서 일단 npm install cookie-parser 를 해줘서 설치를 해줍니다. 

 

app.post('/login',(req,res)=>{
  //요청된 이메일을 데이터베이스에서  있는지 찾고
  User.findOne({email : req.body.email},(err,user)=>{
    if(!userInfo){//유저가 없다면
      return res.json({
        loginSuccess:false,
        message:"제공된 이메일에 해당하는 유저가 없습니다."
      })
    }

  //요청된 이메일이 데이터베이스에 있다면 맞는 비번인지 확인
    user.comparePassword(req.body.password,(err,isMatch)=>{
      if(!isMatch)
      return res.json({loginSuccess: false, message: "비밀번호가 틀렸습니다."
    })

      //비밀번호 까지 맞다면 토큰 생성
        user.generateToken((err,user)=>{
          if(err) return res.status(400).send(err);
                      //토큰 저장을 한다. 어디에? 쿠키? 아니면 로컬스토리지, 세션 스토리지에 해야하는지
            //논란이 많다. 
            res.cookie("x_auth",user.token)
            .status(200)
            .json({loginSuccess: true, userId:user._id})
        })
    })
  })
})

로그인 부분 만들어주고 이때 

const cookieParser = require('cookie-parser');

app.use(cookieParser());

 

위에 선언해줘야 합니다.

 

그리고 일단 로그인 해보면

 

 

이걸로 로그인할것인데 

 

하다보니 오타가있었습니다. 전체 User.js 부분 참고해주세요.

const mongoose  = require('mongoose');
const bcrypt = require('bcrypt');
const saltRounds = 10 // 열자리를 라운드처리하는것
const jwt = require('jsonwebtoken');
const userSchema = mongoose.Schema({
    name : {
        type : String,
        maxlength : 50
    },
    email : {
        type  : String,
        trim : true,
        unique : 1 // 혹시나 띄어쓰기 한경우 띄어쓰기 안되게 
    },
    password : {
        type : String,
        minlength : 5
    },
    lastname : {
        type : String,
        maxlength : 50
    },
    role : {
        type : Number,
        default : 0 // 1 이면 관리자, 0이면 사용자 이렇게 사용 
    },
    image : String,
    token : {
        type : String
    },
    tokenExp : {
        type : Number
    },// 유효 기간 설정
})

userSchema.pre('save',function(next){
    var 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) {//암호화된 비번
            // Store hash in your password DB.
            if(err) return next(err)
            user.password =hash //성공하면 암호화된 비번으로 바꿈
            next()//되돌아가기
        })
    })
 }else{
     next()
 }
})
    userSchema.methods.comparePassword=function(plainPassword,cb){
        //painPassword 1234567  암호화된 비밀번호 "$2b$10$LnOrbKhg...
        //이두개가 맞는지 확인하는 과젖이 필요하다.
        bcrypt.compare(plainPassword,this.password, function(err,isMatch){
            if(err) return cb(err);
                cb(null,isMatch);

        })
    }


    userSchema.methods.generateToken =function(cb){

        var user = this;
        //jsonwebtoken을 이용해서 token을 생성하기
        var token = jwt.sign(user.id,'secretToken')
        user.token = token
        user.save(function(err,user){
            if(err) return res.cb(400)
            cb(null,user)

        })
    }
    
const User = mongoose.model('User',userSchema)
module.exports = {User};// 이모델을 다른곳에서 사용 하기위해서 

postMan에 들어가서

서버를 켜주고 나서 

toHexString()을 사용하라고 되어있었지만 되지 않아그냥했더니 되었으니 참고하세요.

728x90
반응형

댓글