쿠키
-
브라우저 저장소( 로컬 스토리지, 세션 스토리지, 쿠키 )frontend/javascript&web 2022. 2. 17. 16:45
이론편 : 브라우저 저장소 ( Theory of Browser Storage ) 브라우저 저장소 분류 웹 스토리지(Web Storage) : 웹 데이터를 클라이언트에 저장하기 위해 만들어진 키-밸류 형식의 저장소. 쿠키(Cookie) : 서버와 클라이언트 간의 지속적인 데이터 교환을 위해 만들어진 키-밸류 형식의 저장소 웹 스토리지 ( Web Storage) 웹 스토리지는 HTML5에 추가된 클라이언트 기반 키-밸류 저장소 이며, 웹 스토리지는 로컬 스토리지 ( Local Storage ) 와 세션 스토리지 ( Session Storage ) 로 나눌 수 있습니다. 로컬 스토리지와 세션 스토리지의 차이점은 영구성과 범위에 있어서 크게 차이가 납니다. 먼저, 로컬 스토리지 ( Local Storage ) ..
-
NextJS : Prerendering 쿠키 접근시 오류frontend/오답노트 2022. 2. 15. 17:23
문제 : NextJS getCookie의 값으로 화면 렌더링시 발생가능 문제 Text content did not match. Server: Client: 이런 관련한 문제가 발견된다면 해결방법은 아래와 같다. 해당 문제는 NextJS는 모든 페이지를 서버에서 프리 렌더링 하여 보여주게 된다. 그렇기 때문에 프리렌더 과정에서 쿠키에 직접접근하여 데이터를 읽어서 화면을 구성하려하면 문제가 발생한다. 해결방법 : const [user, setUser] = useState(); useEffect(()=>{ setUser(getCookie("user")); },[]); 위와 같이 Mounted시점에 쿠키에서 받아서 user에 할당하여 주면 해결할 수 있다.