session : 백엔드 - 브라우저 활동의 기록

서버가 요청을 받고 응답해주면 서버-브라우저간 연결은 끊기고 유저를 기억하지 않음

이러한 상태를 stateless 라고 한다.

예를 들어 유저가 페이지 get 요청을 하고 서버가 render 하면 서버와 브라우저의 연결은 거기서 끊어진다. wifi처럼 연결을 계속 유지해두지 않는다는 말이다. 그렇기 때문에 다음 요청이 있을 때 유저를 알아보기 위해서 서버는 브라우저에게 session.id를 준다.

session.id는 cookie에 담겨 브라우저에 저장되고 다음 요청시에는 서버에서 해당 cookie를 확인하여 유저를 식별하게 된다.

서버는 현재 사용중인 sessionID를 기억하고있다. 만약 4명의 사용자가 있다면 session store 에는 4개의 sessionID가 들어있다.

session store : session 정보를 저장하는곳. 서버가 재시작되면 사라짐(재시작)

https://youtu.be/tosLBcAX1vk << 노마드코더 세션, 쿠키 개념정리

쿠키는 정보를 주고받는 수단, sessionID를 주고받음 (택배상자와 물건)

1. express - session

npm i express-session

npm에서 express-session을 설치하고

import session from "express-session";

app.use(
  session({
    secret: "Hello!",
    resave: true,
    saveUninitialized: true,
  })
); // 브라우저의 요청이 있을때마다 서버에서 쿠키를 전송함 (어떤 정보든 넣을수 있음)

app.use((req, res, next) => {
  req.sessionStore.all((error, sessions) => {
    console.log("this is session", sessions);
    next();
  });
});

위와 같이 session 정보를 확인할 수 있다.

아래와 같이 요청과 함께 오는 session 정보를 확인할 수도 있다.

app.use((req, res, next) => {
  console.log("세션확인!!", req.session);
  next();
});

위와 같이 세션 안에 cookie를 확인할 수 있고 쿠키에는 path 등등 정보를 지니고있다.

2. session DB 활용

서버가 요청하는 유저를 기억하는 방법

export const postLogin = async (req, res) => {
  const { username, password } = req.body;
  const pageTitle = "Login";
  const user = await User.findOne({ username });
  if (!user) {
    return res.status(400).render("login", {
      pageTitle,
      errorMessage: "An account with this username does not exists.",
    });
  }
  // check if password correct
  const ok = await bcrypt.compare(password, user.password);
  if (!ok) {
    return res.status(400).render("login", {
      pageTitle,
      errorMessage: "Wrong password",
    });
  }
  req.session.loggedIn = true; // loggedIn = true 라는 정보를 session에 담음
  req.session.user = user;
  return res.redirect("/");
};

로그인 post 요청시 req.session object 안에 loggedin 과 user를 저장한 후, req.session을 통해 session을 확인하면 아래와 같은 정보를 얻을 수 있다.

로그인시 이런 정보를 기록하므로써 사용자가 로그인중인지 아닌지 확인할 수 있고, 그에 따라 다른 화면을 출력해줄 수 있다.

사용자를 log-in 시킨다는 것은 req.session object 안에 정보를 넣는다는 것을 의미한다.

이는 res.locals를 통해 할 수 있는데 res.locals에 넣어둔 정보는 pug 탬플릿을 렌더링할때 별도의 변수를 보내주지 않아도 사용할 수 있다.