쿠키와 세션

2019. 3. 8. 10:01스터디



내용이 좋아서 가져온 이글의 출처는 여기#1, 여기#2입니다.



네이티브앱과 웹 간의 호출시에 발생한 문제로 찾아보다가 잘 정리된 내용이 있어서 공유합니다.



쿠키와 세션이 필요한 이유

쿠키와 세션을 이해하기 위해서는 HTTP 프로토콜에 대한 이해가 필요하다. 


HTTP 프로토콜은 Connectionless 하고 Stateless 한 프로토콜이다.

Connectionless : 클라이언트가 서버에 요청을 하고 서버가 클라이언트에게 응답을 보내면 접속을 끊는다.

Stateless : 통신이 끝나면 상태 정보를 유지하지 않는다.


Connectionless 하고 Stateless 한 HTTP 프로토콜을 사용하면서 Server가 Client를 식별할 수 있는 방법이 필요했고 쿠키와 세션을 사용하게 되었다.


HTTP는 Stateless하기 때문에 로그인 상태 정보를 유지하지 않아서 쿠키와 세션을 사용하지 않으면 게시판이나 메일을 확인할 때 페이지를 이동할 때마다 로그인 해야 한다.


쿠키 (Cookie)

쿠키는 클라이언트에 저장되는 키와 값이 들어 있는 작은 데이터 파일이다. 쿠키에는 이름, 값, 만료 날짜, 경로 정보가 들어있다. 

쿠키는 일정 시간동안 데이터를 저장할 수 있어서 로그인 상태를 유지하거나 사용자 정보를 일정 시간 동안 유지해야 하는 경우에 주로 사용된다.


- 쿠키 프로세스

1. 브라우저에서 웹페이지 접속

2. 클라이언트가 요청한 웹페이지를 받으면서 쿠키를 클라이언트 로컬(하드)에 저장

3. 클라이언트가 재 요청시 웹페이지 요청과 함께 쿠키값도 전송

4. 지속적으로 로그인 정보를 가지고 있는 것처럼 사용


- 쿠키 사용 사례

자동로그인, 팝업에서 "오늘 더 이상 이 창을 보지 않음" 체크, 쇼핑몰의 장바구니


- 쿠키의 제한

* 클라이언트에 300개까지 쿠키저장 가능, 하나의 도메인당 20개의 값만 가질 수 있음, 하나의 쿠키값은 4KB까지저장

Response Header에 Set-Cookie 속성을 사용하면 클라이언트에 쿠키를 만들 수 있다.

쿠키는 사용자가 따로 요청하지 않아도 브라우저가 Request시에 Request Header를 넣어서 자동으로 서버에 전송한다.


Response Header의 Set-Cookie 속성을 사용하면 클라이언트에 쿠키를 만들 수 있다. 

만들어진 쿠키는 사용자가 요청하지 않아도 브라우저가 매번 Request Header에 넣어서 서버에 전송하게 됩니다.


- Node.js를 이용하여 쿠키 생성하는 예제

: 코드 작성 후 node [파일 이름]으로 실행하고 웹 브라우저에서 http://127.0.0.1:52273으로 접속


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
var http = require('http');
 
// HTTP 서버 생성
http.createServer(function(request, response){
    // Request 헤더에 쿠키 정보가 있으면 쿠키 정보와 요청 헤더 출력
    if (request.headers.cookie){
        var cookie = request.headers.cookie.split(';').map(function(element){
            var element = element.split('=');
            return {
                key: element[0],
                value: element[1]
            };
        });
 
        // Request 헤더의 쿠키 정보만 출력
        var content = '<h1>Cookies</h1>';
        content += '<h2>'+JSON.stringify(cookie)+'</h2>';
        // Request 헤더 전체 
        content += '<h1>Request headers</h1>';
        content += '<h2>'+JSON.stringify(request.headers)+'</h2>';
 
        response.end(content);
    // Request 헤더에 쿠키 정보가 없으면 쿠키 생성
    } else {
        // Response header의 Set-Cookie 속성을 사용하여 쿠키 생성
        response.writeHead(200, {
            'Content-Type''text/html',
            'Set-Cookie': ['id=ledgku''pw=cookieandsession']
        });
        response.end('<h1>Set cookie</h1>');
    }
// 서버 실행 (http://127.0.0.1:52273)
}).listen(52273function(){
    console.log('Server Running at http://127.0.0.1:52273');
});
cs


- 브라우저 접속

첫 번째 접속이므로 Request Header에 쿠키 정보가 없어 쿠키를 생성한다.



- 브라우저 재접속 (페이지 새로고침)

Cookies 정보 우클릭 Clear, 쿠키 정보 우클릭 Delete 클릭으로 쿠키 삭제 가능


위에서 보는 것처럼 쿠키가 생성되면 브라우저는 Request Header에 자동적으로 쿠키 정보를 넣어서 보내게 됩니다.

하지만 위 방법은 사용자 정보가 클라이언트 컴퓨터에 파일로 남고 클라이언트 컴퓨터에 접근할 수 있는 사람이면 누구든지 열어 정보를 확인할 수 있어 보안상 문제가 발생할 수 있다.


세션 (Session)

세션은 서버 메모리에 저장되는 정보다. 서버에 저장되기 때문에 쿠키와는 달리 사용자 정보가 노출되지 않는다.


로그인 처리 과정을 순차적으로 보면,

1. 사용자가 로그인 페이지에 id / pw를 입력하고 로그인 버튼 클릭

2. 서버에서 사용자가 보낸 id / pw 정보를 확인하고 존재하는 사용자면 서버 메모리에 유일한 세션 ID를 생성하고 사용자 id와 매핑 정보를 저장

3. 클라이언트에 세션 ID를 쿠키로 저장

4. 요청시 마다 서버는 Request Header의 쿠키 정보(세션 ID)를 확인하고 세션 ID와 매핑되는 id의 사용자로 인식


세션은 서버 메모리에 저장되지만 세션 역시 클라이언트에 쿠키로 저장된다는 것이 중요하다.


- Node.js를 이용하여 세션 생성하는 예제

: npm install express, npm install express-session으로 해당 모듈을 먼저 설치해야 한다.

: express-session은 세션을 쉽게 생성할 수 있게 도와주는 미들웨어이다. 여기에서는 유일한 세션 ID를 생성하는 것보다 세션이 생성되고 클라이언트에 쿠키로 저장되는 흐름을 봐야 한다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
var express = require('express');
var session = require('express-session');
 
var app = express();
 
app.use(session({
     // 비밀 키를 지정한다.
    secret: 'secret key',
    // 세션이 변경되지 않았어도 세션 저장소에 반영(resave)할지 설정한다.
    resave: false,
    // 초기화되지 않은 세션을 세션 저장소에 저장할지 설정한다.
    saveUninitialized: true,
    // 생성할 cookie와 관련된 정보를 지정
    cookie: {
        // cookie가 사라지는 시간
        maxAge: 60 * 1000
    }
}));
 
app.use(function(request, response) {
    // 현재 시간을 now 세션에 
    request.session.now = (new Date()).toUTCString();
 
    var content = '<h1>Session</h1>';
    content += '<h2>'+JSON.stringify(request.session)+'</h2>';
    content += '<h1>Request headers</h1>';
    content += '<h2>'+JSON.stringify(request.headers)+'</h2>';
 
    response.send(content);
});
 
app.listen(52273function() {
    console.log('Server Running at http://127.0.0.1:52273');
});
 
cs


- 브라우저 접속

: 최초 접속시 세션이 생성되고 클라이언트에 쿠키가 생성된다. 재접속시 Request Header에 쿠키 정보가 표시된다.



세션을 사용해도 클라이언트의 쿠키에 저장된 세션 ID를 다른 사람이 가로채서 자신의 세션 ID를 가로챈 세션 ID로 변조해서 사용할 수 있다.

세션을 사용하는 것만으로는 아직 보안에 취약하다. 그래서 IP 정보를 함께 사용하거나 쿠키 값 변조를 확인하는 방법 등으로 보완하여 사용한다.


'스터디' 카테고리의 다른 글

웹서비스란..  (0) 2019.04.08
쿠키와 세션  (0) 2019.03.08
DataBaseConnetionPool (DBCP)  (0) 2019.03.07
CISA 출제 영역 및 일정  (0) 2019.03.04
정부전자문서 유통 표준(2014.11)  (0) 2019.03.04
CISA(Certified Information Systems Auditor) - 목차  (0) 2019.02.26