所以我正在观看这个 youtube tutorial 并且在 1:12:00 左右，我的应用程序停止工作。经过一些研究，我发现 Provider 在 v4 中已被弃用，需要使用 SessionProvider。所以“_app.js”文件中的代码看起来像这样。
import { SessionProvider } from 'next-auth/react';
import { Session } from "next-auth"
function MyApp({ Component, pageProps }) {
return (
<SessionProvider session={pageProps.session}>
{/* <Provider store={store}> */}
<Component {...pageProps} />
{/* </Provider> */}
</SessionProvider>
)
}
export default MyApp
[...nextauth].js 中的代码如下所示。
import NextAuth from 'next-auth'
import { SessionProvider } from 'next-auth/react';
export default NextAuth ({
// Configure one or more authentication providers
SessionProvider: [
Providers.Facebook({
clientId: process.env.FACEBOOK_CLIENT_ID,
clientSecret: process.env.FACEBOOK_CLIENT_SECRET
})
// ... add more providers here
]
})
index.js 中的代码如下所示
import Head from 'next/head'
import Header from '../components/Header'
import Login from '../components/Login';
import { useSession } from "next-auth/react"
// import { SessionProvider } from "next-auth/react"
// import { Session } from "next-auth"
export default function Home( { session }) {
if(!session) return <Login /> ;
return (
<div>
<Head>
<title>Facebook</title>
</Head>
{/* Header */}
<Header />
<main>
{/* Sidebar */}
{/* Feed */}
{/* Widgets */}
</main>
</div>
)
}
export async function getServerSideProps(context) {
// Get the user
const { data: session } = useSession();
return {
prop:{
session
}
}
}
我尝试阅读文档并观看了一些视频，但不同的视频使用不同的技术。我想了解 Next Auth，如果有人能向我解释或指出正确的方向，我将不胜感激。我也一直在 youtube 上寻找新视频，因为我正在观看的视频已经过时了。谢谢。