2-8 express-session

1. express-session

 

express-session은 Express.js에서 세션(Session)기능을 쉽게 구현하기 위한 미들웨어입니다.

 

세션(Session)을 사용하기 위해서는 사용자 인증과 세션 스토리지를 통해서 사용자 정보를 저장하고,

세션 정보가 담긴 쿠키를 사용자에게 발급하는 과정이 필요하였습니다.

express-session은 이런 복잡한 과정을 생략하여 간단하게 세션 기능을 구현할 수 있도록 도와주는 미들웨어입니다.

 

2. express-session 시작하기

 

express-session은 세션 ID를 클라이언트에게 발급하고,

이 세션 ID를 통해 서버는 클라이언트의 상태를 추적할 수 있습니다.

 

즉, 클라이언트 세션 ID를 발급받은 후에는 모든 서버 요청마다 세션 ID가

포함된 쿠키를 전달하게 되며, 이로 인해 서버는 클라이언트를 쉽게 식별할 수 있게 됩니다.

→ 이전에 구현하였던 Session 객체에 세션 ID를 저장한 것과 동일한 방법이랍니다.

그러면 이제, 하나의 예시를 바탕으로 express-session의 동작 방식을 확인해봅시다.

 

 

yarn Package 설치

 

yarn init -y

 

yarn add express express-session

 

package.json안에서 type : module 추가하기

 

app.js

import express from "express";

import expressSession from "express-session";

const app = express();

const PORT = 3019;

app.use(express.json());

app.use(

  expressSession({

    secret: "express-session-secret-key",

    // 세션을 암호화하는 비밀 키를 설정

    resave: false,

    // 클라이언트 요청이 올 때마다 세션을 새롭게 저장할 지 설정, 변경사항이 없어도 다시 저장

    saveUninitialized: false,

    // 세션이 초기화되지 않았을 때 세션을 저장할지 설정

    cookie: {

      maxAge: 1000 * 60 * 60 * 24,

      //ms, second, minutes, hours 1일로 설정

    },

  })

);

app.listen(PORT, () => {

  console.log(PORT + "포트로 서버가 열렸습니다!.");

});

 

app.use(

  expressSession({

    secret: "express-session-secret-key",

    // 세션을 암호화하는 비밀 키를 설정

    resave: false,

    // 클라이언트 요청이 올 때마다 세션을 새롭게 저장할 지 설정, 변경사항이 없어도 다시 저장

    saveUninitialized: false,

    // 세션이 초기화되지 않았을 때 세션을 저장할지 설정

    cookie: {

      maxAge: 1000 * 60 * 60 * 24,

      //ms, second, minutes, hours 1일로 설정

    },

  })

);

 

• secret
  • 세션 ID를 암호화하기 위한 비밀 키입니다.
  • 클라이언트에게 발급할 세션 ID를 암호화하기 위한 비밀 키 정보입니다.
• resave
  • 클라이언트의 **요청(Request)**이 들어올 때마다 세션 정보를 다시 저장할 지 설정합니다.
  • 변경사항이 없더라도 true 로 설정하면, 매번 새로운 세션에 저장됩니다.
• saveUninitialized
  • req.session에 아무런 정보가 저장이 되지 않더라도 사용자에게 세션 ID를 발급할 지 설정합니다.
  • true 로 설정하면, 서버에 접속하는 모든 사용자에게 세션 ID가 발급됩니다.
• cookie.maxAge
  • 세션 ID가 저장된 클라이언트의 쿠키 만료 기간을 설정합니다.

 

3. express-session  API 만들기

POST/sessions API를 호출했을 때 전달 받은 userId를 세션에 저장하고,

GET/sessions API를 호출했을 때 클라이언트의 세션 정보를 출력하는 API를

구현해보도록 하겠습니다.

 

POST/sessions API 만들기

// 세션 등록 API

app.post("/sessions", (req, res, next) => {

  const { userId } = req.body;

  req.session.userId = userId;

  return res.status(201).json({ message: "세션을 설정했습니다." });

});

• req.session은 클라이언트의 세션 정보를 관리하는 데 사용되는 객체입니다.
• 클라이언트의 요청이 들어온다면, req.session.userId에 원하는 정보를 저장합니다.
• userId 대신 다른 이름을 사용하려면 req.session.<원하는 프로퍼티 명>의 형식으로 사용하면 된답니다.

GET/sessions API  만들기

// 세션 조회 API

app.get("/sessions", (req, res, next) => {

  console.log(req.session);

  return res.status(200).json({

    message: "세션을 조회했습니다",

    session: req.session.userId ?? null, // 세션에 저장된 userId를 조회합니다.

  });

});

• express-session은 클라이언트가 전달한 쿠키의 세션 ID를 바탕으로 req.session에서 정보를 조회합니다.
• 만약, 클라이언트가 제공한 세션 ID에 일치하는 세션이 없을 경우, null을 반환합니다.
• ??은 Nullish Coalescing Operator라고 불리는 연산자로 null 또는 undefined인 경우에만 오른쪽 값을 반환하는 연산자 입니다.
• ||는 false, 0, "", NaN 등도 거짓으로 취급하는 반면, ??은 오직  null과 undefined만 고려합니다.

Insomnia로 localhost:3019/session으로 POST, GET을 해보겠습니다.

Post

POST가 잘 된 걸 확인할 수 있고,

 

그리고, connect.sid(sessionId)라는  쿠키가 오른쪽에 할당된 것을 확인할 수 있습니다.

 

Get

서버에서는 session값이 조회된 "Hello World"가 출력되는걸 볼 수 있습니다.

그리고 터미널에서는 Session 정보로 위와 같이

 

경로, 날짜, 남은 세션 기간, http 접속 유무, userId를 확인할 수 있습니다.

 

하지만, 현재 세션 정보를 인(IN) 메모리 방식으로 구현해 서버를 껐다 키면

세션 정보들이 전부 사라지게 됩니다.

→ DB에 세션 정보들을 저장해야한다!