NextJS : document is not defined 오류

문제 : document is not defined

Text content did not match. Server:  Client:

이런 관련한 문제가 발견된다면 해결방법은 아래와 같다. 해당 문제는 NextJS는 모든 페이지를 서버에서 프리 렌더링 하여 보여주게 된다. 해당 시점에 document에 접근하려고 하면 접근할 수 없어서 에러를 뱉어내게 된다. 해결방안으로는 다음과 같다.

 

해결방법 : 

function getCookie = (user:string) => {
	if(typeof window !== 'object') return;
	let value = document.cookie.match("(^|;) ?" + name + "=([^;]*)(;|$)");
	return value ? value[2] : null;
}

위와 같이 window객체가 있을때만 동작하게 작성하면 된다.

코드작성할땐 위와 같이 if(조건){동작} 말고 if(부정조건) return; 하위에 코드를 작성하는 것이 보기가 좋은거 같다.