[Network] Cookie - httpOnly / secure 차이점

직접 Cookie 의 httpOnly 와 secure 속성을 만들어가면서 어떤 차이점이 있는지 알아보았다.

소개

• httpOnly - JavaScript 로 쿠키에 접근할 수 없으며, 브라우저의 통신이 일어날 때만 쿠키를 전달
• secure - HTTPS 가 아닌 다른 프로토콜을 통해 쿠키를 전달하는 것을 방지

 

테스트

"teams_test" 라는 이름으로 httpOnly 와 secure 속성을 가진 쿠키를 사용했을 때와 안했을 때를 관찰하고, 그 차이점을 알아보는 것이 목적이다.

 

SSL 인증서를 사용할 수 있는 환경에서 진행했으며, "test" Endpoint (일반 사용자 호스트) → "hack" Endpoint (공격자 호스트) 로 호출하면서 서로 다른 호스트라고 가정하고 실제로는 같은 호스트에서 진행하였다.

 

httpOnly

속성이 없을 경우

아래와 같이 악성코드(?) 가 삽입되어 있다고 가정한다.

"test" 에서 쿠키를 만들고, 악성코드(?) 에 의해 "hack" 에서 값을 전달받는다고 가정한다.

 

쿠키가 생성된 모습

최종적으로 "hack" 서버에서 쿠키를 전달받은 모습

 

속성이 있을 경우

httpOnly 속성을 넣어서 쿠키를 생성해보자. 원래대로라면 위처럼

document.cookie

에 의해서 해당 서버의 쿠키 정보가 유출되어야 할 것이나, 위 속성을 포함해서 만들게 되면 JavaScript 에서 참조를 하지 못하기 때문에 정보 유출을 방지할 수 있다.

"test" 에서 httpOnly 속성을 넣은 쿠키를 만들어보자. 해당 쿠키는 이후에 "hack" 으로 전달되지 않는다.

 

httpOnly 속성이 추가된 쿠키가 생성된 모습

최종적으로 전달받은 모습이며 최상단에 해당 쿠키가 없는 것을 확인할 수 있다. (모자이크로 나머지를 가렸지만 결과엔 쿠키가 존재하지 않는다)

 

 

secure

속성이 없을 경우

사이트 중에 HTTPS 가 아닌 HTTP 로 연결되는 특정 사이트의 링크나 이미지 등이 있다고 가정해보자.

아래는 HTTP 로 페이지가 이동되도록 작성한 것이다.

사용자가 "test" 로 들어가면서 그 다음으로 "hack" 으로 쿠키 정보가 전달된다고 가정한다.

 

"hack" 으로 이동되기 전에 쿠키가 생성된 모습

현재는 보안이 강화되었기 때문에 우리가 사용하고 있는 브라우저들에서는 기본적으로 차단하고 있다.

"hack" 으로 이동되었을 때 브라우저에서 차단된 모습

실제 대상 서버에서도 남겨진 쿠키가 존재하지 않는다.

 

 

속성이 있을 경우

아래처럼 secure 속성을 넣고 진행해보자

secure 속성을 넣어서 쿠키를 생성해보자

 

secure 속성이 존재한 쿠키가 생성된 모습

 

쿠키가 존재하지 않는 모습