Correct way to protect a page using getServerSideProps?

[MattHeslington]

Hello Gladly,

Apologies if this is a stupid question, but for a while now I have been using the following code to protect my pages and check on the server before the page is shown to see if we have a logged-in user:

export const getServerSideProps = withAuthUserSSR({ whenUnauthed: AuthAction.REDIRECT_TO_LOGIN,}) (async () => {})
const HomeWithAuth = withAuthUser({ whenUnauthedAfterInit: AuthAction.REDIRECT_TO_LOGIN, })(Home)
export default HomeWithAuth

However, this causes a non-breaking "Error: Objects are not valid as a React child (found: object with keys {children})" output in the console, which is caused by the getServerSideProps line above

What is the absolute correct way to do this, to protect a page using getServerSideProps? I don't want to show the protected page at all if we don't have a logged-in user. On the page I'm protecting I'm not actually fetching any data using GSSP, if that makes any difference?

Cheers, Matt

EDIT: Apologies, the getServerSideProps code isn't causing the problem at all. I took everything apart and narrowed it down to some code I was using for persistent layouts. However, is this still the correct way to protect a page?

[kmjennison]

Hi Matt, the code you provided should do what you're looking for: if a user is not authenticated, the server will return a redirect instead of the protected page.

Note that you don't have to provide an empty function. You can just do this:

export const getServerSideProps = withAuthUserSSR()()

[MattHeslington]

Fantastic, many thanks, Kevin