권한 분기

권한분기

 

• 사용자 서버 안에서 로그인한 유저 / 로그인 안한 유저로 권한을 구분
• 권한을 구분하는 방법으로 useEffect에서 accessToken이 없으면 "/login" 화면으로 페이지를 이동시킴

 

 

	export default function QuizLoginSuccessPage() {
	const router = useRouter();
	const { data } = useQuery(FETCH_USER_LOGGED_IN);
	const { userInfo, setUserInfo, accessToken } = useContext(GlobalContext);
	useEffect(() => {
	if (userInfo.email) return;
	if (!accessToken) {
	router.push("/quiz/login");
	alert("로그인을 먼저 해주세요");
	}
	setUserInfo({
	name: data?.fetchUserLoggedIn.name,
	email: data?.fetchUserLoggedIn.email,
	picture: data?.fetchUserLoggedIn.picture,
	});
	}, []);
	return (
	<>
	<div>로그인에 성공하셨습니다!</div>
	{data?.fetchUserLoggedIn.name}님 환영합니다~
	</>
	);
	}

view raw 권한분기.js hosted with ❤ by GitHub

└ 권한분기를 하려면 로그인 권한을 부여하려는 페이지에 모두 위의 로직을 입력해야하는 번거로움이 있음

    └ 따라서, 이 문제를 해결하기 위해서 HOC를 사용함 !!