useSession호출시 무한 렌더링

NextJs13에서 NextAuth사용시 클라이언트 컴포넌트에서 useSession을 사용하여 Console.log를 찍으며 무한으로 렌더링이 된다.

예시

"use client";
import { useSession } from "next-auth/react";

const ClientSession = async (props) => {
    let session = useSession();
    console.log(session);
    return (
        <div>
            <div>클라이언트 세션</div>
        </div>
    );
};
export default ClientSession;

위의 코드는 session을 무한으로 로그를 남기게 된다...

 

원인은 잘 모르겠다 ㅡㅡ;;

 

해결 방법은 컴포넌트를 다른 방식으로 만들면된다.

"use client";
import { useSession } from "next-auth/react";

export default function page(props) {
    let session = useSession();
    console.log(session, new Date());
    return <div>클라이언트 세션</div>;
}

이리 하면..  딱 한번만 로그를 남기고 끝난다.