Function withPageAuthRequired

Wrap your getServerSideProps with this method to make sure the user is authenticated before visiting the page.

// pages/protected-page.js
import { withPageAuthRequired } from '@auth0/nextjs-auth0';

export default function ProtectedPage() {
  return <div>Protected content</div>;
}

export const getServerSideProps = withPageAuthRequired();
Copy

If the user visits /protected-page without a valid session, it will redirect the user to the login page. Then they will be returned to /protected-page after login.

Wrap your Server Component with this method to make sure the user is authenticated before visiting the page.

// app/protected-page/page.js
import { withPageAuthRequired } from '@auth0/nextjs-auth0';

export default function withPageAuthRequired(ProtectedPage() {
  return <div>Protected content</div>;
}, { returnTo: '/protected-page' });
Copy

If the user visits /protected-page without a valid session, it will redirect the user to the login page.

Note: Server Components are not aware of the req or the url of the page. So if you want the user to return to the page after login, you must specify the returnTo option.

You can specify a function to returnTo that accepts the params (An object containing the dynamic route parameters) and searchParams (An object containing the search parameters of the current URL) argument from the page, to preserve dynamic routes and search params.

// app/protected-page/[slug]/page.js
import { withPageAuthRequired } from '@auth0/nextjs-auth0';

export default function withPageAuthRequired(ProtectedPage() {
  return <div>Protected content</div>;
}, {
  returnTo({ params }) {
    return `/protected-page/${params.slug}`
  }
});
Copy