TIL 220803

강지훈·2022년 8월 30일
0

[로컬스토리지와 세션스토리지]
웹스토리지라고도 하며 HTML5와 함께 도입됨. "브라우저 스토리지"에 저장되는 조각, 즉, 크롬을 사용한다면 크롬에만 저장이 되고 그 정보를 파이어폭스 등 다른 브라우저에서는 볼 수 없다.
오리진에 종속됨
#오리진? http://site.com:8080/

1.로컬 스토리지
로컬 저장소는 웹 브라우저에서 키/값 쌍의 형태로 클라이언트 브라우저에 데이터를 저장하는 방법
데이터는 사용자가 브라우저에서 수동으로 삭제하지 않는 한 평생 동안 로컬 저장소에 저장됩니다. 사용자가 창이나 탭을 닫아도 만료되지 않습니다. 대신 데이터는 브라우저의 메모리가 지워질 때까지 브라우저에 남아 있습니다.
로컬 저장소에는 설정, 검색,제거 및 지우는 데 사용할 수 있는 네 가지 방법이 있습니다.

설정: localStorage.SetItem(key,value);
탐색: localStorage.GetItem(key);
제거: localStorage.removeItem(key);
전체제거: localStorage.clear()

특징
로컬 저장소에 저장된 데이터에는 만료 날짜가 없습니다.
저장 용량은 최대 10MB 입니다. 보통은 5MB
로컬 스토리지 데이터는 자동으로 서버로 전송되지 않습니다.

2.세션 스토리지
SessionStorage는 localStorage와 매우 유사하며
탭을 닫을 때 삭제됨 최대 5MB

[제대로 배우는 쿠키]
클라이언트에 데이터를 저장하는 방법 중 하나. 쿠키는 요청을 할 때 서버에 자동으로 전송됨. 클라이언트와 서버 둘다 조작 가능. 보통 서버에서 만료기한 등을 설정 및 컨트롤을 함
Set-Cookie 헤더에 설정된 작은 데이터 조각 4kb까지 가능

세션 쿠키
세션 쿠키는 Expires 또는 Max-Age와 같은 속성을 지정하지 않은 것.
브라우저가 닫힐 때 제거됩니다.

영구 쿠키
영구 쿠키는 Expires 또는 Max-Age 속성을 지정한 것. 이 쿠키는 브라우저를 닫을 때 만료되지 않지만 특정 날짜 또는 일정 기간이 지나면 제거 됩니다.

httponly
공격자가 자바스크립트로 빼낼 수 없음

요청이 동일한 도메인에서 시작된 경우에만 쿠키가 애플리케이션으로 전송되도록 허용

세션 ID 설정 시
보통 cookie에 세션ID를 담는데 세션ID기반으로 클라이언트의 인증정보를 알 수 없게 해야 함. 세션 ID를 공격자가 추측하기 어렵게 길고 랜덤하게 생성하는 알고리즘하고 사용자 수에 대비, 충분히 큰 수로 하고 http only 옵션, 세션 타임아웃 걸어야 함

쿠키의 시큐어코딩
쿠키는 간접수집에 해당하며 해당하는 지침을 준수하며 서비스를 구축해야
합니다.

쿠키는 행동에 기반한다 -> 맞춤형 광고
쿠키 기반으로 만들어진다.

[로컬스토리지,세션스토리지,쿠키의 차이]
필요한 이유
1. 서버에 대한 요청을 줄임
2. 네트워크 연결 없이 웹사이트를 더 빨리 다운로드

저장목록
-사이트 기본 설정 커스터마이징(색상,글꼴 크기 등)
-로그인 상태 저장

profile
never stop

0개의 댓글