로컬 로그인 구현하기(1)

로컬 로그인이란 다른 SNS 서비스를 통해 로그인하지 않고 자체적으로 회원가입 후 로그인하는 것을 의미합니다. 즉, 아이디/비밀번호 또는 이메일/비밀번호를 통해 로그인하는 것입니다.

Passport에서 이를 구현하려면 passport-local 모듈이 필요합니다. 이미 설치했으므로 로컬 로그인 전략만 세우면 됩니다. 로그인에만 해당하는 전략이므로 회원가입은 따로 만들어야 합니다.

routes/middlewares.js

exports.isLoggedId = (req, res, next) => {
  if (req.isAuthenticated()) {
    next();
  } else {
    res.status(403).send("로그인 필요");
  }
};

exports.isNotLoggedIn = (req, res, next) => {
  if (!req.isAuthenticated()) {
    next();
  } else {
    const message = encodeURIComponent("로그인한 상태입니다.");
    res.redirect(`/?error=${message}`);
  }
};

 

Passport는 req 객체에 isAuthenticaed 메서드를 추가합니다. 로그인 중이면 req.isAuthenticated()가 true고, 그렇지 않으면 false입니다. 따라서 로그인 여부를 이 메서드로 파악할 수 있습니다. 라우터들 중에 로그아웃 라우터나 이미지 업로드 등은 로그인한 사람만 접근할 수 있게 해야 하고, 회원가입 라우터나 로그인 라우터는 로그인하지 않는 사람만 접근할 수 있게 해야 합니다.

 

routes/page.js

const express = require("express");
const { isLoggedIn, isNotLoggedIn } = require("./middlewares");

const router = express.Router();

router.use((req, res, next) => {
  res.locals.user = req.user;
  res.locals.followerCount = 0;
  res.locals.followingCount = 0;
  res.locals.followerCount = [];
  next();
});

router.get("/profile", isLoggedIn, (req, res) => {
  res.render("profile", { title: "내 정보 - NodeBird" });
});

router.get("/join", isNotLoggedIn, (req, res) => {
  res.render("join", { title: "회원가입 - NodeBird" });
});

router.get("/", (req, res, next) => {
  const twits = [];
  res.render("main", {
    title: "NodeBird",
    twits,
  });
});

module.exports = router;

 

자신의 프로필은 로그인을 해야 볼 수 있으므로 isLoggedIn 미들웨어를 사용합니다. req.isAuthenticated()가 true여야 next가 호출되어 res.render가 있는 미들웨어로 넘어갈 수 있습니다. false라면 로그인 창이 있는 메인 페이지로 리다이렉트됩니다.

회원가입 페이지는 로그인을 하지 않은 사람에게만 보여야 합니다. 따라서 isNotLoggedIn 미들웨어로 req.isAuthenticated()가 false일 때만 next를 호출하도록 했습니다.