MongoDB - 세션방식 로그인 기능 구현

세션방식을 통한 로그인 기능 구현

 

1. 세션 로그인이 뭐고 어떻게 동작하는 건가요?

회원가입을 하면 ID와 Password 를 DB에 저장합니다.

 

유저가 로그인을 하면 DB에 저장된 ID와 Password가 존재할 때 로그인을 시켜주는데

이 때 유니크한 session id를 만들어줍니다.

그리고 유저의 브라우저 쿠키에 session id 를 저장시킵니다.

 

유저가 로그인이 필요한 활동을 할 때 쿠키에 담겨져 있는 session id를 DB의 seesion id와 비교하여 통과시켜줍니다.

 

로그인하면 session id 발급, DB에 session id 저장 >

유저 브라우저 쿠키에 발급된 session id 저장 됨 >

로그인 필요 활동 시 브라우저 쿠키의 session id와 DB의 session id 대조 

 

 

 

 

2. 세팅하기

라이브러리 3개 설치하기

npm install passport passport-local express-session

 

module 불러오고 middleware 세팅하기

const passport = require('passport');
const LocalStrategy = require('passport-local').Strategy;
const session = require('express-session');

// '비밀코드'에는 아무런 비밀번호나 넣으면 됩니다.
app.use(session({secret : '비밀코드', resave : true, saveUninitialized: false}));
app.use(passport.initialize());
app.use(passport.session());

 

 

 

 

3. 로그인 form 만들기

      <form action="/login" method="POST">
          <input type="text" class="form-control" name="id" />
          <input type="text" class="form-control" name="password" />
          <button type="submit" class="btn btn-outline-secondary">Submit</button>
      </form>

 

 

 

4. GET으로 페이지 만들기

app.get("/login", (요청, 응답) => {
  응답.render("login.ejs");
});

 

 

 

 

5. POST로 로그인 성공/실패 시 수행할 동작 설정하기

app.post("/login", passport.authenticate("local", {

=> local 방식으로 하겠다. (그게 뭔지는 모름)

    failureRedirect: "/fail",

=> 인증 실패 시 '/fail' 경로로 이동시키기

  }),

  (요청, 응답) => {

    응답.redirect("/");

=> 인증 성공 시 '/' 경로로 이동시키기

  }

);

 

 

 

 

6. id와 password를 검증하는 과정

passport.use(

  new LocalStrategy(

    {

      // 유저가 form에 입력한 name 속성을 넣어주기

      usernameField: "id",

      passwordField: "password",

      // 로그인 후 세션 저장여부

      session: true,

// id, password 이외에 검증할 정보를 callback의 req에 담을지 여부(안써서 모름)

      passReqToCallback: false,

    },

// id, password 검증 과정. 서버에러 있니? id/password일치하니? 검증

    function (입력한아이디, 입력한비번, done) {

      db.collection("login").findOne({ id: 입력한아이디 }, function (에러, 결과) {

        // done의 인자는 각각 (서버에러, 성공 시 유저DB데이터/실패 시 false넣기, 출력할 에러메시지)

        if (에러) return done(에러);

        if (!결과) return done(null, false, { message: "존재하지않는 아이디요" });

        if (입력한비번 == 결과.password) {

          return done(null, 결과);

        } else {

          return done(null, false, { message: "비번틀렸어요" });

        }

      });

    }

  )

);

 

7. 검증한 뒤 결과의 id를 가지고 세션을 만들고 쿠키로 보내기

        if (입력한비번 == 결과.password) {
          return done(null, 결과);

 

위의 결과가 user 인자로 들어가게 되고, 

 

passport.serializeUser(function (user, done) {

  done(null, user.id);

});

serializeUser 메서드가 유저의 id를 바탕으로 세션데이터를 만들고,

이를 쿠키로 만들어서 브라우저에 저장시킵니다.