I'm trying to get some data from my server depending on whose currently logged in. I'm using Next-Auth and normally I can just call:
const { data: session } = useSession();
At the top of the functional component, but you cannot do this in getServerSideProps().
I need to make a get request like this:
export async function getServerSideProps() {
const res = await fetch(
`http://localhost:5000/api/users/${session.id}/following`
);
const isFollowing = res.json();
return {
props: { props: isFollowing },
};
}
that has the current users session ID dynamically put in.
How do I access my session ID inside getServerSideProps?
Since useSession is react-hook - it can be used only inside Component. For server-side usage there another method from Next-Auth package - getSession. https://next-auth.js.org/v3/getting-started/client#getsession
Server-Side Example
import { getSession } from "next-auth/client"
export default async (req, res) => {
const session = await getSession({ req })
/* ... */
res.end()
}
Note: When calling getSession() server side, you need to pass {req} or context object.
you should to re-assign the headers from the getServerSideProps request to inner fetch, because that fetch has no headers, cookies or tokens
export async function getServerSideProps(ctx) {
const headers=ctx.req.headers //where cookies, jwt or anything
const res = await fetch(
`http://localhost:5000/api/users/${session.id}/following`,
{headers}
);
const isFollowing = res.json();
return {
props: { props: isFollowing },
};
}