[NodeJS] 웹 브라우저 쿠키와 세션 알아보기

 

오늘은 웹개발의 기초인 쿠키와 세션에 대해 알아보려고 합니다.

 

🤷‍♀️ 1. 쿠키란

한 사이트에 회원가입 혹은 로그인을 한 뒤, 그 창을 껐다 켜도 로그인 상태로 남아있는 경우를 경험해본 적이 있을 겁니다. 다. 여기서 쿠키가 사용되는데요. 서버가 사용자의 웹 브라우저에 전송하는 데이터라고 생각하시면 됩니다! 브라우저가 이 데이터를 저장했다가, 동일한 서버로 요청이 오면 저장되어있던 데이터를 이용할 수 있게 되는 것이죠.

 

 

💪 2. 코드 작성해보기

이제 nodeJs로 간단한 코드 하나 작성해 보겠습니다.

const express = require('express');
const app = express();
const cookieParser = require('cookie-parser');
const port = 3000

app.use(cookieParser());

app.get('/count', function(req, res){
    res.cookie('count', 1);     //cookieParser 안의 cookie라는 메소드를 사용하여 cookie 넘겨주기
});

app.listen(port, function(){
    console.log('Connected Success');
});

 

우선 필요한 npm들은 다 install 해주세요!

 

위의 코드들은 count라는 키로 1이라는 값을 쿠키로 저장하는 코드입니다.

cookie라는 메소드는 cookieParser 안에 있는것인데요. 이 메소드를 통해 클라이언트로 데이터들을 넘겨줍니다.   

 

서버를 실행시켜주고 localhost:3000/count로 접속한 뒤 F12 -> 네트워크에 들어가보시면

 

요청 헤더의 Cookie count = 1이 보이실 겁니다. 

이런 식으로 쿠키를 저장하고 불러올 수 있습니다.

하지만 쿠키는 보안에 치명적인데요. 회원의 정보를 저장하는 쿠키를 생성했을 경우, 다른 사람들에게도 쉽게 회원 정보가 유출 됩니다.

그리하여 사용하게 될 것은 session이라는 것입니다.

 

🤷‍♀️ 3. 세션(session) 이란

세션은 쿠키를 기반으로 하고있지만, 데이터를 서버 측에서 관리합니다. 사용자의 정보 파일을 브라우저에 저장하는 쿠키의 보안 문제를 한 층 해결한 것이죠. 

 

 

💪 4. 코드 작성해보기

이제 한 번 간단한 코드를 작성해보겠습니다.

 

const express = require('express');
const session = require('express-session');
const port = 3000

const app = express();
app.use(session({
    secret: '1234322#@3wrwed',      //랜덤 값(쿠키 아이디) 넣기
    resave: false,              // 세션 아이디를 한 번 발급했으면 다시 발급하지 말아라
    saveUninitialized: true     // 세션 id를 사용하기 전까진 발급하지 말아라
}));

app.get('/session', function(req, res){
    if(req.session.count){
        req.session.count++;
    } else {
        req.session.count = 1;
    }
    res.send('count : ' + req.session.count);
});

app.listen(port, function(){
    console.log('Connected Success');
});

   

 

필요한 npm들은 다 install 해주세요!

위의 코드를 간단히 설명하자면 count라는 이름의 세션이 없다면 1로 초기화 된 count 세션을 만들고, 있다면  count 세션을 하나씩 추가해라. 라는뜻입니다.

 

하나씩 살펴보겠습니다. 먼저 세션에 사용되는 정보들을 설정해줘야 하는데요.

seceret에는 임의의 쿠키 아이디 값을 넣어줍니다. 

resave에는 세션 아이디를 한 번 발급하였다면 다시 발급하지 마라는 뜻입니다.

saveUninitialized는 세션 아이디를 사용하기 전가지는 발급하지 말라는 뜻입니다.

 

뭐 저도 어디서 주워들은 거지만 false, true가 국룰 이라네요... (죄송해요저도이건잘...)

 

아무튼!!! 서버를 실행시키고, localhost:3000/session으로 접속해보면

 

이렇게 쿠키와는 다르게, 해독하기 어려운 이상한 문자들이 값으로 들어간 것을 볼 수 있습니다!