[node.js] passport(local 로그인, 로그아웃 구현)

📌 passport

: 로그인 기능을 다방면으로 도와주는 모듈 

google, facebook, github 등 소셜 로그인 구현을 위한 기능 제공

 

✅ passport 설치

소셜로그인이 아닌 local 방식 구현을 위해 passport-local도 같이 설치 

npm i passport
npm i passport-local

 

서버 코드에 모듈 추가(passport: 세션을 사용)

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

// Session
app.use(
  session({
    secret: 'bay',
    resave: false,
    saveUninitialized: true,
    cookie: {
      maxAge: 1000 * 60 * 60,
    },
  })
);

// Passport
app.use(passport.initialize());
app.use(passport.session());

 

✅ passport, local 전략 설정 

• passport는 기본적으로 로그인을 어떤 방식으로 처리할지 미리 정해놓음
• 실제 로그인 처리는 passport.authenticate 메소드 이용하여 처리
• 아이디와 비밀번호를 어떤 키 값으로 받을지 설정
• 인증 절차 수행하는 함수 설정
• 인증 절차 수행의 결과는 callback에 담아서 처리 

id, pw로 사용할 키 값 설정

new LocalStrategy(
      {
        usernameField: 'id',
        passwordField: 'password',
      },

 

실제 로그인 기능 구현 부분

async (id, password, cb) => {
// 서버에 유저 정보를 전달하여 id 가 있는지 확인
const client = await mongoClient.connect();
const userCursor = client.db('db명').collection('users');
const idResult = await userCursor.findOne({ id });
// id가 존재하면 비밀번호 까지 있는지 확인하기
if (idResult !== null) {
  const result = await userCursor.findOne({
    id,
    password,
  });
  // 비밀번호 까지 일치하면 콜백 함수에 찾은 유저 정보를 전달
  if (result !== null) {
    cb(null, result);
  } else {
    // 각각 상황에 맞는 에러 메세지 전달
    cb(null, false, { message: '비밀번호가 다릅니다.' });
  }
} else {
  cb(null, false, { message: '해당 id 가 없습니다.' });
}
}

 

전체 코드

passport.use(
  new LocalStrategy(
    {
      usernameField: 'id',
      passwordField: 'password',
    },
    async (id, password, cb) => {
      const client = await mongoClient.connect();
      const userCursor = client.db('kdt1').collection('users');
      const idResult = await userCursor.findOne({ id });
      if (idResult !== null) {
        const result = await userCursor.findOne({
          id,
          password,
        });
        if (result !== null) {
          cb(null, result);
        } else {
          cb(null, false, { message: '비밀번호가 다릅니다.' });
        }
      } else {
        cb(null, false, { message: '해당 id 가 없습니다.' });
      }
    }
  )
);

 

✅ passport, serialzeUser

• passport도 session을 사용하여 로그인 여부 판단
• 위 코드에서 callback함수에 담긴 내용은 serialzeUser 메소드가 받아서 세션을 만들어 전달 받은 유저 정보를 세션에 저장
• 해당 세션은 req.user로 접근하여 정보 확인 가능
• 콜백 함수에 의해 user.id 부분이 세션에 저장되는 코드 

passport.serializeUser((user, cb) => {
  cb(null, user.id);
});

 

✅ passport, deserializeUser

• passport는 더 까다롭게 로그인 여부를 판단하기 때문에 로그인한 사용자가 다른 페이지에 접속하려고 할 때에도 계속 인증을 요구
• 해당 기능을 deserializeUser가 수행
• session에 저장된 사용자 정보를 통해서 db에 사용자가 실제로 있는지 꾸준히 확인하는 과정 거침

passport.deserializeUser(async (id, cb) => {
  const client = await mongoClient.connect();
  const userCursor = client.db('db명').collection('users');
  const result = await userCursor.findOne({ id });
  if (result) cb(null, result);
});

 

🔍

session -> 로그인이 되면 이후는 계속 믿고 감

passport -> 로그인이 되어 있는지 꾸준히 체크 및 유저 확인

 

✅ passport 로그인

passport.authenticate 메소드가 처리

passport.authenticate('local', (err, user, info) => {

에러 발생 시 : err 매개변수에 에러 값이 담김

로그인 성공 시: user에 전달한 user 정보가 담겨서 넘어옴

로그인 실패 시: user은 null로 리턴되며, 전달한 메시지는 info 매개변수의 객체에 담겨서 전달됨

 

매개변수 사진 설명

 

router.post('/', (req, res, next) => {
  passport.authenticate('local', (err, user, info) => {
    if (err) next(err);
    if (!user) {
      return res.send(
        `${info.message}<br><a href="/login">로그인 페이지로 이동</a>`
      );
    }
    req.logIn(user, (err) => {
      if (err) next(err);
      res.redirect('/board');
    });
  })(req, res, next);
});

 

✅ passport 로그아웃

req.logout 메소드 사용 

router.get('/logout', (req, res, next) => {
  req.logout((err) => {
    if (err) {
      return next(err);
    }
    return res.redirect('/');
  });
});

 

✅ 로그인 여부에 따른 게시판 서비스 변경 

passport에 의해 login된 유저 session은 req.user에 담기게 되므로 isLogin 함수에 조건 추가 

function isLogin(req, res, next) {
  if (req.session.login || req.user) {
    next();
  } else {
    res.send('로그인 해주세요.<br><a href="/login">로그인 페이지로 이동</a>');
  }
}

 

회원 아이디 값이 req.session.userId뿐만아니라, req.user.id도 생겼으므로 해당 부분도 수정

 게시판 렌더링 부분 수정 

// 게시판 처음 렌더링 할 때 
router.get('/', isLogin, async (req, res) => {  
  const client = await mongoClient.connect();
  const cursor = client.db('kdt1').collection('board');
  const ARTICLE = await cursor.find({}).toArray();
  
  const articleLen = ARTICLE.length;
  res.render('board', {
    ARTICLE,
    articleCounts: articleLen,
    userId: req.session.userId ? req.session.userId : req.user.id,
  });  
});

 게시판 글쓰기 부분 수정

router.post('/', isLogin, async (req, res) => {
  if (req.body) {
    if (req.body.title && req.body.content) {
      const newArticle = {
        id: req.session.userId ? req.session.userId : req.user.id,
        title: req.body.title,
        content: req.body.content,
      };
      
      const client = await mongoClient.connect();
      const cursor = client.db('kdt1').collection('board');
      await cursor.insertOne(newArticle);
      res.redirect('/board');
    } else {
      const err = new Error('요청 이상');
      err.statusCode = 404;
      throw err;
    }
  } else {
    const err = new Error('요청에 데이터가 없습니다');
    err.statusCode = 404;
    throw err;
  }
});

 

👊🏻 서버 코드 정리 (LocalStrategy 모듈화)

localStratege.js 파일 생성 

-> passport, LocalStrategy 모듈 불러오기

-> module.exports를 하나의 익명 함수로 묶어서 처리

-> serialzeUser, deserialzeUser 도 같이 묶어서 처리

 

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

const verifyModule = require('./register').verifyPassword;

const mongoClient = require('./mongo');

// 익명함수 전달
module.exports = () => {
  passport.use(
    new LocalStrategy(
      {
        usernameField: 'id',
        passwordField: 'password',
      },
      async (id, password, cb) => {
        const client = await mongoClient.connect();
        const userCursor = client.db('node1').collection('users');
        // {id : id} = {id}
        const idResult = await userCursor.findOne({ id });
        // console.log(idResult);
        if (idResult !== null) {
          if (idResult.salt !== undefined) {
            const pwResult = verifyModule(
              password,
              idResult.salt,
              idResult.password
            );
            if (pwResult) {
              cb(null, idResult);
            } else {
              cb(null, false, { message: '비밀번호가 틀렸습니다.' });
            }
          } else if (idResult.password === password) {
            cb(null, idResult);
          } else {
            cb(null, false, { message: '비밀번호가 틀렸습니다.' });
          }
        } else {
          cb(null, false, { message: '해당 id가 없습니다.' });
        }
      }
    )
  );

  // idResult -> user
  passport.serializeUser((user, cb) => {
    cb(null, user.id);
  });

  // 통신을 해야하니까 async사용
  passport.deserializeUser(async (id, cb) => {
    const client = await mongoClient.connect();
    const userCursor = client.db('node1').collection('users');
    const result = await userCursor.findOne({ id });
    if (result !== null) cb(null, result);
  });

 

메인 서버 수정 

const localStrategy = require('./routes/localStrategy’);
localStrategy();