I am using getServerSideProps function in next.js with Next-Auth and I'm getting a TypeError:
TypeError: Cannot destructure property 'nextauth' of 'req.query' as it is undefined.
When I checked using the console, it does indeed return undefined.
I have been following the official documentation for NextAuth.js: https://next-auth.js.org/configuration/nextjs#getserversession
My function:
export const getServerSideProps = async (context: { req: NextApiRequest; res: NextApiResponse<any>; }) => {
const session = await getServerSession(context.req, context.res, authOptions)
if (!session) {
return {
redirect: {
destination: '/',
permanent: false
}
}
}
return {
props: {
session,
}
}
}
When I do:
const {req: query} = context
console.log(query == undefined)
console returns false, but the TypeError is still there.
I receive a different error when I change the props for this function:
export const getServerSideProps = async (req: NextApiRequest, res: NextApiResponse<any>) => {
const session = await getServerSession(req, res, authOptions)
if (!session) {
return {
redirect: {
destination: '/',
permanent: false
}
}
}
return {
props: {
session,
}
}
}
The error then is:
My _App: TypeError: Cannot read properties of undefined (reading 'x-forwarded-host')
export default function App({
Component, pageProps: { session, ...pageProps}}: AppProps, {emotionCache = clientSideEmotionCache,}){
return (
<SessionProvider session={pageProps.session}>
<CacheProvider value={emotionCache}>
<ThemeProvider theme={lightTheme}>
<CssBaseline />
<Component {...pageProps} />
</ThemeProvider>
</CacheProvider>
</SessionProvider>
);
};
Any suggestions on what to do next?
