• component* 不能是async。如果你想在React中异步获取数据，你缺少的核心React概念是 * 维护状态 *。定义一个状态值来存储数据、在效果中获取数据并更新状态。

例如：

export default function Nav() {
  const [session, setSession] = useState();

  useEffect(() => {
    const fetchData = async () => {
      const result = await getServerSession();
      setSession(result);
    };
    fetchData();
  }, []);

  console.log(session?.user);

  return (
    <nav className="flex justify-end">
      {!session?.user && <Login />}
      {session?.user && <Logged />}
    </nav>
  );
}

在我的记忆中，你不能导出一个默认的异步组件。或者你不应该直接使用await getServerSession（）。使用类似getServerSideProps的东西来执行getServerSession并发送带有页面属性的信息。或者尝试创建一个包含会话状态，如下所示：

export default function Nav() {
  
  const [session, setSession] = useState(null)

  useEffect(()=>{
    const getSession = async () => {
        try{
            const res = await getServerSession();
            if (typeof res === "undefined" || !!!res)
            {
                throw Error("Cannot get server session");
            }
            setSession(res)
        }
        catch (e) 
        {
            console.error(e)
        }

    }
    getSession()
  },[])
  return (
    <nav className="flex justify-end">
      {!session?.user && <Login />}
      {session?.user && <Logged />}
    </nav>
  );
}

next-auth的文档告诉使用getServerSideProps如下：

import { authOptions } from 'pages/api/auth/[...nextauth]'
import { getServerSession } from "next-auth/next"
export default YourComponent = (props) => {
// ...your component
}
export async function getServerSideProps(context) {
  const session = await getServerSession(context.req, context.res, authOptions)

  if (!session) {
    return {
      redirect: {
        destination: '/',
        permanent: false,
      },
    }
  }

  return {
    props: {
      session,
    },
  }
}

看到https://next-auth.js.org/configuration/nextjs希望它能回应你的答案

组件不能是异步函数，它必须是React Functional Component或React Class Component
为了解决您遇到的问题，您可以在useEffect中调用async函数，当组件将挂载时：

import Login from "./Login"
import Logged from "./Logged"
import { useEffect, useState } from "react"
import { getServerSession } from "next-auth"

export default function Nav() {
  const [user, setUser] = useState()
  useEffect(() => {
      const fetchAndSet = async () => {
          try {
              const responseData = await getServerSession()
              setUser(responseData.user)
          } catch (error) {
             // Handle your errors in here
         }
     };

      fetchAndSet()
  }, [])

  return (
    <nav className="flex justify-end">
      {user ? <Logged /> : <Login />}
    </nav>
  );
}