[Express] passport-local-mongoose 간단정리(React 연동)

1. 설치

npm install passport passport-local passport-local-mongoose

yarn add passport passport-local passport-local-mongoose

 

2. 스키마 모델 생성

 

/*user.js*/

 

///////////////////////

const mongoose = require('mongoose');

const passportLocalMongoose = require('passport-local-mongoose');

 

const userSchema = new mongoose.Schema({

    username : { type : String },

    nickname : { type : String },

    Regi_date : { type : Date, default : Date.now()},

}, {

    versionKey : false

});

userSchema.plugin(passportLocalMongoose);

module.exports = mongoose.model('User', userSchema);

///////////////////////

 

3. Express-session 및 passport 적용

* passport.session 보다 express-session 이 꼭 먼저 올라와야 합니다.

///////////////////////

const app = express();

const cors = require('cors');

const passport = require("passport");

const User = require("./models/user");

 

app.use(cors({

    origin : 'http://localhost:3000',

    credentials : true,    

}));

app.use(passport.initialize()); // passport 초기화

app.use(passport.session());  

passport.use(User.createStrategy());

passport.serializeUser(User.serializeUser());

passportdeserializeUser(User.deserializeUser());

///////////////////////

 

4. 라우터 생성

///////////로그인///////////

router.post("/login",passport.authenticate("local"), function (req, res) {

    res.json("성공");

  }

);

///////////회원가입///////////

router.post("/signup", function (req, res) {

  User.register(

    new User({ username: req.body.username, nickname: req.body.nickname }),

    req.body.password,

    function (err, user) {

      if (err) {

        console.log(err);

      } 

    }

  );

});

///////////로그아웃///////////

router.get('/logout', function(req, res) {

  req.logout();

  res.json('로그아웃');

});

///////////로그인테스트///////////

router.get("/logintest", function (req, res) {

  console.log(req.isAuthenticated());

  if (req.isAuthenticated()) {

    res.json("세션이있어");

  } else {

    res.json("세션이없어");

  }

});

 

5. React 에서

///////////로그인///////////

async Login() {

    await axios.post('http://localhost:3001/DBapi/login', 

    {

      username : this.state.id,

      password : this.state.pw,

    },

    { withCredentials : true }

    )      

}

///////////회원가입///////////

async Register() {

    await axios

      .post("http://localhost:3001/DBapi/signup", {

        username: this.state.id,

        password: this.state.pw,

        nickname: this.state.nickname,

      })

}

///////////로그인체크///////////

async logincheck() {

    await axios.get('http://localhost:3001/DBapi/logintest',

    { withCredentials : true }

    )

}

///////////로그아웃///////////

async logout() {

    await axios.get('http://localhost:3001/DBapi/logout',

    { withCredentials : true }

    )

}

 

* form으로 보낼 때는 username, password 필드가 있어야 되는 것 같습니다.

* 한번 써보시고 입맛에 맞게 바꾸는 것을 강추드립니다.