농담곰담곰이의곰담농

크래프톤 정글 6기 TIL - Day 1~4 | 쿠키 세션 그리고 SSR

by 브이담곰

  정글에서 매일 TIL을 쓰겠다고 다짐하며 들어왔지만, 막상 0주차-미니 프로젝트를 진행해보니 매일 TIL을 작성할 엄두가 안났다. 기숙사에 도착해서 씻고 나면 2시정도다 보니... 그래서 정글에서 미니 프로젝트를 하며 다룬 주제들을 정리해보려고 한다.

 


쿠키와 세션

쿠키와 세션

 

쿠키 : 사이트에 방문하고 이용할 때 브라우저에 저장되는 내 정보

세션(session) :  서버에서 이용자에게 기한이 짧은 임시 키 하나를 발급해주고 쿠키에 저장하는 방법. 브라우저를 방문하고 이용할 때 임시 키를 이용해 DB에서 사용자 정보를 조회 후 접근 허가를 내림.

 

JWT

JWT

 

쿠키 정보에 사용자의 모든 정보를 담에서 서버가 쿠키만 확인 후 접근을 허용하는 방법.

 

JWT 헤더 구조

{
  "typ" : "JWT", 
  "alg" : "HS256", //encoding algorithm
  "kid" : "1918290"
}

 

JWT 페이로드

{
  "sub" : "monty-pythons-flying-circus",
  "iss" : "urn://apigee-JWT-policy-test",
  "aud" : "fans",
  "iat" : 1506553019,
  "exp" : 1506556619, // 만료 기한
  "jti" : "BD1FF263-3D25-4593-A685-5EC1326E1F37",
  "show": "And now for something completely different."
}

SSR vs CSR

SSR vs CSR

 

SSR( Server-Side-Rendering )

- 서버에서 페이지의 HTML을 랜더링 하여 클라이언트에 보여주는 방식. 클라이언트는 서버로받은 파일을 그대로 랜더링 하므로 추가적인 JS 작업을 수행하지 않음.

 

장점 

1)  SEO 최적화

      완성된 페이지 정보를 검색 엔진이 쉽게 크롤링 가능

2) 빠른 페이징 렌더링

    - 화면 구성에 필요한 HTML 파일을 서버에서 바로 전달해주기 떄문에 초딩 로딩 속도가 빠름

    - 서버에서 랜더링하기 떄문에 기기 및 브라우저 성능이 좋지 않아도 페이지 로딩이 빠르고 일관적임.

3) 보안

    - 중요한 처리들을 서버에서 하기 때문에 외부에 노출될 가능성이 없음

 

단점

1) 화면 깜빡임

2) 서버 부하 증가

 

CSR( Client-Side-Rendering )

- 콘텐츠가 사용자의 브라우저에서 동적으로 생성되어 랜더링되는 방식.

 

장점

1) 사용자 상호작용 원활

2) 서버 부하 감소 ( 렌더링 과정이 클라이언트에서 처리 되므로 )

 

단점

1) SEO

2) 초기 로딩 속도 ( 브라우저가 JS를 다운받고 DOM을 생상하는데 걸리는 시간을 더 기다려야함 )

3) 보안 이슈

    - 쿠키, 로컬 스토리지에 저장되는 사용자 정보 도용에 취약

    - 핵심 기능이 클라이언트에서 수행되므로 로직의 노출 가능성이 있음.

 

블로그의 정보

농담곰담곰이의곰담농

브이담곰

활동하기