[Node.js] Cookie-Parser로 쿠키 구현하기

▶ 쿠키란?

쿠키란, 브라우저와 웹 서버 간에 정보를 교환과 유지를 위해 사용하는 데이터를 말한다.

쿠키는  클라이언트(웹 브라우저) 측에 저장되고, KEY : VALUE 방식으로 데이터를 저장한다.

 

'오늘 하루 이 팝업 보지 않기'나, '로그인 상태 유지' 등 사용자와 브라우저간의 이전 상호작용을 기억하거나,

사용자별로 다른 콘텐츠를 표시하려 할 때 쿠키를 주로 사용한다.

 

Node.js에서는 Cookie-Parser라는 미들웨어를 통해 쿠키 읽기, 쓰기, 삭제 등을 수행한다.

---

Cookie-Parser 설치 방법

npm install cookie-parser

npm install --save-d @types/cookie-parser // Typescript 환경에서 작업하는 경우

npm 명령어를 통해 Cookie-Parser를 설치한다.

TypeScript 환경에서 작업하는 경우에는 두 명령어를 모두 실행해 줘야 타입스크립트 컴파일러가 미들웨어를 정상적으로 인식할 수 있다.

---

Cookie Parser 설정

import cookieParser from "cookie-parser";

const app = express();

app.use(cookieParser());
// 다른 미들웨어 설정 코드
app.use(api.path, api.router);

app.listen( async function app() {

    console.log('============================================');
    console.log(`Server is listening on port ${port}`);
    console.log('============================================');

});

위와 같은 코드로 Cookie-Parser를 설정하는데, 이때 주의할 점은 app.use(cookieParser()) 코드가 반드시 API 경로를 선언하는 코드보다 위쪽에 위치해야 한다.

아래쪽으로 작성하면, Cookie-Parser가 쿠키 읽기,쓰기 등 요청한 작업을 정상적으로 수행할 수 없다.

(진짜 중요!!! 이것 때문에 레퍼런스를 얼마나 찾아봤는지... 끔찍)

---

쿠키 쓰기

res.cookies ( 'name', 'cookie-value', {'option'})

 

 

쿠키의 이름, 값을 설정해 쿠키를 만들 수 있고, option은 생략 가능하다.

const userCookie = JSON.stringify({
                        userId: '1',
                        userName: '홍길동'
                    });

 

쿠키 값은 위와 같이 JSON 형식으로도 작성할 수 있다.

쿠키 쓰기 옵션

res.cookies ( 'name', 'cookie-value', {
	signed: true,
	secure: true,
	httpOnly: true,
	expires:
	maxAge: 2 * 60 * 60 * 1000
	path:
	domain:
})

• signed: true로 설정할 경우, 쿠키에 서명을 할 수 있다.
• secure: true로 설정할 경우 HTTPS로만 쿠키를 사용할 수 있다.
• httpOnly: true로 설정할 경우 HTTP로만 쿠키를 사용할 수 있다.
• domain: 쿠키의 도메인을 지정할 수 있다. 기본값은 "loaded"
• path: 쿠키의 경로를 지정해줄 수 있다. 기본값은 "/"
• expires:  쿠키의 만료 기간을 지정해 줄 수 있다.  [UTC 기준 시간으로 설정]
• maxAge: 쿠키의 만료 시간을 지정해 줄 수 있다. [밀리초 단위로 설정]

expires, maxAge 옵션 등 으로 만료 시간을 지정하지 않으면, 사용자가 브라우저를 닫을 때 쿠키가 삭제된다.

---

쿠키 읽기

console.log(req.cookies);

console.log(req.cookies.userid);

req.cookies를 사용해 쿠키 전체를 읽어오거나, req.cookies.userid 등을 통해 쿠키에 저장된 특정 값만을 읽어올 수도 있다.

---

쿠키 삭제

res.clearCookie('cookie-name', req.cookies, { '생성 때 사용한 옵션' });

삭제하려는 쿠키의 이름, 값, 옵션이 모두 일치해야 삭제할 수 있다.

---

서명된 쿠키

import cookieParser from "cookie-parser";

const app = express();

app.use(cookieParser('비밀키'));
// 다른 미들웨어 설정 코드
app.use(api.path, api.router);

// Other codes

cookieParser() 함수에 비밀키 값을 넣어주면 서명된 쿠키를 만들 수 있고, 읽어온 쿠키를 검증할 수 있다.

비밀키는 특별한 규칙 없이 '1111'과 같은 문자열도 가능하지만, 서버에서 서명된 쿠키를 생성하고 검증할 때 사용하므로 예측하기 어렵도록 작성하고, 환경변수 등을 통해 관리하는 것이 좋다.

 

// 서명된 쿠키 쓰기
res.cookie('cookiename', usercookie, { signed: true, 'Other Options' });


// 서명된 쿠키 읽기
console.log(req.signedCookies);

위 방법으로 서명된 쿠키를 쓰거나, 읽어올 수 있다.