Ununterbrochenes erneutes Rendern bei Verwendung von Next-Auth in NextJS
P粉811329034
P粉811329034 2023-09-05 11:08:49
0
1
564
<p>这是我的“/app/api/auth/[...nextauth]/route.js“</p> <pre class="brush:php;toolbar:false;">NextAuth aus "next-auth/next" importieren; GoogleProvider aus "next-auth/providers/google" importieren; export const authOptions = { Anbieter: [ GoogleProvider({ clientId: process.env.GOOGLE_CLIENT_ID, clientSecret: process.env.GOOGLE_CLIENT_SECRET, }), ], }; const handler = NextAuth(authOptions); export { Handler als GET, Handler als POST };</pre> <p> und sessionProvider.js</p> <pre class="brush:php;toolbar:false;">"Client verwenden"; import React von "react"; import { SessionProvider } from "next-auth/react"; const Sessionprovider = ({children }) => { return <SessionProvider>{children}</SessionProvider>; }; Standard-Sessionprovider exportieren;</pre> <p>我用这个将子元素包装在 Layout.js 中</p> <pre class="brush:php;toolbar:false;"><html lang="en"> <body className={inter.className}> <Sessionprovider>{children}</Sessionprovider> </body> </html></pre> <p>这是我的 page.js</p> <pre class="brush:php;toolbar:false;">"Client verwenden"; import { getServerSession } from „next-auth“; import { signIn, signOut, useSession } from "next-auth/react"; import { authOptions } from "./api/auth/[...nextauth]/route"; Exportieren Sie die asynchrone Standardfunktion Home() { const { Daten: Sitzung, Status } = useSession(); console.log(session); const _signInWithGoogle = async () => { wait signIn("google"); }; zurückkehren ( <div className="flex justify-center items-center flex-col gap-3 p-5"> <h1 className="font-semibold text-lg">Homepage</h1> {Sitzung ? ( <-Taste onClick={() => Abmelden()} className="p-1 bg-blue-400 text-white font-semibold abgerundet-md hover:bg-blue-500" > Abmelden </button> ) : ( <-Taste onClick={_signInWithGoogle} className="p-1 bg-blue-400 text-white font-semibold abgerundet-md hover:bg-blue-500" > Anmelden </button> )} </div> ); }</pre> <p>Wenn ich die App ausführe, wird sie immer wieder neu gerendert. Jede Hilfe hierzu wäre sehr dankbar. Da die Konsole das Benutzerobjekt anzeigt, verbleibt es in der Anmeldekomponente. </p>
P粉811329034
P粉811329034

Antworte allen(1)
P粉828463673

您需要从客户端组件中删除async

"use client";

export default function Home() {
}

https://github.com/vercel/next.js/issues/48822

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage