從「next-auth/next」匯入 NextAuth; 從「next-auth/providers/google」匯入 GoogleProvider; 導出常數 authOptions = { 提供者:[ 谷歌提供者({ clientId:process.env.GOOGLE_CLIENT_ID, clientSecret:process.env.GOOGLE_CLIENT_SECRET, }), ], }; const 處理程序 = NextAuth(authOptions); 匯出 { 處理程序為 GET,處理程序為 POST };; <p>和sessionProvider.js</p>
「使用客戶端」; 從“反應”導入反應; 從“next-auth/react”導入{SessionProvider}; const Sessionprovider = ({ 孩子 }) => { 返回{children} ; }; 導出預設Sessionprovider;</pre> <p>我在 Layout.js 中使用這個將子元素包裝</p><body className={inter.className}>{子層級} </正文> </html></pre> <p>這是我的 page.js</p>「使用客戶端」; 從“next-auth”導入{ getServerSession }; 從「next-auth/react」匯入{signIn、signOut、useSession}; 從“./api/auth/[...nextauth]/route”導入{ authOptions }; 導出預設非同步函數 Home() { const { 資料:會話,狀態 } = useSession(); 控制台.log(會話); const _signInWithGoogle = async () =>; { 等待登入(“Google”); }; 返回 (); }</pre> <p>當我運行應用程式時,它會不斷地重新渲染。對此的任何幫助都不會勝感激。由於控制台顯示用戶對象,它仍然保留在登入元件中。</p>首頁
{會議 ? ( <按鈕 onClick={() =>;登出()} className =“p-1 bg-blue-400 文字-白色字體-半粗體圓形-md懸停:bg-blue-500” > 登出 </按鈕> ) : ( <按鈕 onClick={_signInWithGoogle} className =“p-1 bg-blue-400 文字-白色字體-半粗體圓形-md懸停:bg-blue-500” > 登入 </按鈕> )}
P粉8284636732023-09-06 00:06:41
您需要從客戶端元件中刪除async
。
"use client"; export default function Home() { }
https://github.com/vercel/next.js/issues/48822