[Next.js] Iron Session에 대해 알아보자

// 참고: sinclairr 님의 벨로그

1. Iron-Session 이란?

1. 암호화된 쿠키를 이용하는 Node.js stateless session utilituy 이다.
2. 기본적으론 JWT와 흡사합지만, 토큰 정보에 대해 암호화,복호화를 한다는 점이 다름

2. 동작방식

1. user(Browser)가 server에 req을 보냄
2. server 에서 해당 정보를 암호화한 cookie를 만듬
3. 이후 user에게 res를 보낼떄 cookie를 같이 보냄
4. user는 암호화된 cookie를 가지고, 이후 req에 이 cookie가 같이 보내짐
5. server는 cookie를 받게 되면 복호화를 진행 후 정보를 활용함

=> 쿠키를 만들고, 유저에게 보내는 작업을 직접 할 필요 x . Iron Session에서 제공하는 helper Fn을 사용하면 됨

3. 설치 

yarn add iron-session
// npm i iron-session

4. withIronSessionAPIRoute  ( feat. findUser() )

• DB에서 원하는 id를 가진 user를 가져오는 법은 findUser(id) 가 있다.

import { NextApiRequest, NextApiResponse } from "next";

export default async function handler(req: NextApiRequest, res: NextApiResponse) {
  const id = 1;
  const foundUser = findUser(id);

  res.json({ ok: true, foundUser });
}

• id가 아닌 현재 로그인 되어있는 user의 정보를 얻어오는 법은?
• 이를 위해서는 req에서 id를 가져오는 작업이 필요함
• 이 행위는 withIronSessionAPIRoute()를 통해 가능

import { NextApiRequest, NextApiResponse } from "next";
import { withIronSessionApiRoute } from "iron-session/next";    //여기 next 붙여야함
import { IronSessionOptions } from "iron-session";

const options: IronSessionOptions = {
  cookieName: "reservation-site",
  password:
    "VERYYLONGPASSWORDS1ab1323898esda345q6781!",
};

async function handler(req: NextApiRequest,res: NextApiResponse) {
  const id = req.session.user.id;   //req의 쿠키에 user가 저장되어 있는 경우, 이렇게 정보 가져올수있음
  const foundUser = await findUser(id);

  res.json({ ok: true, foundUser });
}

export default withIronSessionApiRoute(handler, options);

 

• handler : 기존 API 핸들러 함수
• options : IronSessionOptions 타입 객체 , 쿠키 및 패스워드 정보 갖고 있음
  • 쿠키: 브라우저에 저장되는 쿠키의 이름
  • 패스워드: 32이상의 비밀번호. 암호화/복호화에 사용됨
• 위와 같이 작성하면 타입스크립트는 session내의 데이터에 대한 정보를 몰라서 에러를 띄운다.

declare module "iron-session" {
  interface IronSessionData {
    user?: {
      id: number;
    };
  }
}

 

5. 세션에 데이터를 저장하는 법( Save() )

if (req.method === "POST") {
  const {
    body: { userId },
  } = req;
  
  // Assign value
  req.session.user = {
    id: +userId,
  };
  
  // Save at a session
  await req.session.save();
  
  res.json({ ok: true });
}

• POST 요청이 들어왔을때 userId를 세션에 값을 할당한 후 save()함수를 실행시킨다.
• 이렇게만 하면 세션에 저장 및 이후 암호화된다잉