서버에서 클라이언트에 영속성있는 데이터를 저장하는 방법
영속성
: 데이터를 생성한 프로그램의 실행이 종료되더라도 사라지지 않는 데이터의 특성을 의미.
서버가 원한다면 서버는 클라이언트의 쿠키를 이용하여 데이터를 가져올 수 있다.
쿠키를 이용하는 것은 단순히 서버에서 클라이언트에 쿠키를 전송하는 것만 의미하지 않고 클라이언트에서 서버로 쿠키를 다시 전송하는 것도 포함된다.
쿠키의 특징
데이터를 저장한 이후 아무 때나 데이터를 가져올 수는 없다. 데이터를 저장한 이후 특정한 조건들이 만족되어야 다시 가져올 수 있기 때문이다.
//쿠키 옵션
'Set-Cookie':[
'cookie=yummy',
'Secure=Secure; Secure',
'HttpOnly=HttpOnly; HttpOnly',
'Path=Path; Path=/cooke',
'Domain=Domain; Domain=nadavelog.com'
]
쿠키 옵션에서 도메인은 포트 및 서브 도메인 정보, 세부 경로를 포함하지 않는다.
ex) http://www.localhost.com:3000/users/login
이라 하면 여기에서 Domain 은 localhost.com
이 된다.
쿠키 옵션에서 도메인 정보가 존재한다면 클라이언트에서는 쿠키의 도메인 옵션과 서버의 도메인이 일치해야만 쿠키를 전송 할 수 있다. 이를 통해 naver.com
에서 받은 쿠키를 google.com
에 전송하는 일을 막을 수 있다.
Path
는 세부 경로로써 서버가 라우팅할 때 사용하는 경로를 의미한다.
ex)http://www.localhost.com:3000/users/login
이라 하면 여기에서 Path
, 즉 세부 경로는 /users/login
이 된다. 이를 명시하지 않으면 기본적으로 /
으로 설정되어 있다.
Pah
옵션의 특징은 설정된 경로를 포함하는 하위 경로로 요청을 하더라도 쿠키를 서버에 전송할 수 있다.
쿠키가 유효한 기간을 정하는 옵션.
MaxAge
는 쿠키가 유효한 시간을 초 단위로 설정하는 옵션.
Expires
은 MaxAge
와 비슷하지만 언제까지 쿠키가 유효한지 지정할 수 있다. 이때 옵션의 값은 클라이언트의 시간을 기준으로 한다. 이후 지정된 시간, 날짜를 초과하게 되면 쿠키는 자동으로 파괴된다.
쿠키는 위 옵션의 여부에 따라 세션 쿠키Session Cookie
와 영속성 쿠키Persistent Cookie
로 나눠진다.
세션 쿠키 : MaxAge
or Expires
옵션이 없는 쿠키. 브라우저가 실행 중일 때 사용할 수 있는 임시 쿠키. 브라우저를 종료하면 쿠키는 삭제된다.
영속성 쿠키 : 브라우저의 종료 여부와 상관없이 MaxAge
orExpires
에 지정된 유효시간만큼 사용가능한 쿠키
사용하는 프로토콜에 따른 쿠키의 전송 여부를 결정하는 옵션.
만약 Secure
옵션이 true
로 설정된 경우 HTTPS를 이용하는 경우에만 쿠키를 전송할 수 있다.
자바스크립트에서 브라우저의 쿠키에 접근 여부를 결정한다. 해당 옵션이 true
로 설정된 경우, 자바스크립트로 쿠키에 접근이 불가하다.
명시되지 않은 경우 기본으로 false
로 지정되어 있다.
이 경우 document.cookie
를 이용해 자바스크립트에서 쿠키접근이 가능하므로 XSS 공격에 취약해진다.
Cross-Origin 요청을 받은 경우 요청에서 사용한 메소드와 해당 옵션(e.g. GET
, POST
,PUT
, PATCH
...)의 조합을 기준으로 서버의 쿠키 전송 여부를 결정하게 된다. 사용 가능한 옵션은 다음과 같다.
Lax
: Cross-Origin 요청이라면 GET
메소드에 대해서만 쿠키를 전송할 수 있다.Strict
: 단어 그대로 가장 엄격한 옵션으로, Cross-Origin 이 아닌 same-site
인 경우에만 쿠키를 전송 할 수 있다.None
: Cross-Origin에 대해 가장 관대한 옵션으로 항상 쿠키를 보내줄 수 있다. 다만 쿠키 옵션 중 Secure
옵션이 필요하다.이 때 same-site
는 요청을 보낸 Origin과 서버의 도메인, 프로토콜, 포트가 같은 경우를 말한다. 이중 하나라도 다르다면 Cross-origin으로 구분된다.
서버에서 이러한 옵션들을 지정한 다음 서버에서 클라이언트로 쿠키를 처음 전송하게 된다면 헤더에 Set-Cookie
라는 프로퍼티로 쿠키를 담아 전송한다.
이후 클라이언트에서 서버에게 쿠키를 전송해야 한다면 클라이언트는 헤더에 Cookie
라는 프로퍼티에 쿠키를 담아 서버에 쿠키를 전송하게 된다.
쿠키의 특성을 이용하여 서버는 클라이언트에 인증정보를 담은 쿠키를 전송하고, 클라이언트는 전달받은 쿠키를 서버에 요청과 같이 전송하여 Stateless
한 인터넷 연결을 Stateful
하게 유지할 수 있다.
하지만 기본적으로 쿠키는 오랜 시간 동안 유지될 수 있고, HttpOnly 옵션을 사용하지 않았따면 자바스크립트를 이용해서 쿠키에 접근할 수 있기 때문에 쿠키에 민감한 정보를 담는 것은 위험하다.