HTML 문서상의 요소들을 하나의 직사각형 박스로 정의하는 모델
Box-Sizing
width
와 weight
의 값이 콘텐츠 기준인지, 경계선 기준인지 정의
box-sizing: content-box;
: 기본값. 콘텐츠 기준(내부 여백 포함 X)box-sizing: border-box;
: 경계선 기준(외부 여백 포함 X)두개 이상의 블록 요소의 상하 마진이 겹칠 때, 더 큰 마진이 적용되고 작은 마진은 무시되는 현상
마진 상쇄가 일어나는 3가지 경우
마진 상쇄 적용 규칙
마진 상쇄 규칙 예외
position: absolute;
된 상태float: left/right;
된 상태 (clear 되지 않은 상태)display: flex;
일 때 내부 flexbox itemdisplay: grid;
일 때 내부 grid itemCookie
클라이언트의 웹 브라우저에 저장되는 데이터 조각으로 클라이언트의 요청을 식별하는데 사용된다. 쿠키는 요청마다 함께 전송되며, 탈취될 수 있어 보안에 취약하기 때문에 민감한 정보들을 제외한 정보들을 저장하는데 사용한다.
Session
브라우저가 서버에 연결되어 있는 동안에 유지되는 데이터 집합으로 사용자의 정보를 서버에 저장하고 그 정보를 식별할 수 있는 "세션 ID"를 Set-Cookie
헤더로 클라이언트에게 전송한다.
속성 | Cookie | Session |
---|---|---|
저장 위치 | 클라이언트 | 서버 |
저장 형식 | Text | Object |
만료 | 저장 시 설정(없으면 브라우저 종료 시) | 서버에서 관리 |
리소스 | 클라이언트 리소스 | 서버 리소스 |
용량 | 도메인당 20개 쿠키 당 4KB | 제한 없음 |
JWT는 웹표준(RFC 7519)으로서 두 개체에서 JSON 객체를 사용하여 가볍고 자가수용적인 방식으로 정보를 안전성 있게 전달할 수 있다.
구성요소
JWT는 마침표(.
)를 구분자로 3개의 문자열로 구성된다.
aaaaa.bbbbb.ccccc
순서대로 헤더(Header), 내용(Payload), 서명(Signature)라 한다.
typ
)과 해싱 알고리즘(alg
)를 가진다. 토큰의 타입은 "JWT"가 들어가며, 해싱 알고리즘은 서명을 생성할 때 사용한다.{
"typ": "JWT",
"alg": "HS256"
}
key-value
쌍으로 저장한다. 클레임의 종류는 크게 세가지로 구분된다.iss
, sub
, aud
, exp
, nbf
, iat
, jti
Base64
로 인코딩한 값이다.