Skip To Main Content

getNextServerSideProps

The getNextServerSideProps function lets you server side render your page with WordPress data outside of the template hierarchy using Next.js file based pages. The function should be returned from getServerSideProps which is required by Next.js to perform Server-Side Rendering (SSR)

Usage

The getNextServerSideProps function accepts two arguments: the server side props context, and an object (type GetNextServerSidePropsConfig) with a Page key. This should be your Next.js page component.

export async function getServerSideProps(context: GetServerSidePropsContext) {
  return getNextServerSideProps(context, {
    Page: MyPage,
  });
}
Code language: JavaScript (javascript)

Faust uses MyPage passed via getNextServerSideProps to fetch the data using the ‘query’ and ‘variables’ properties. If the Page does not have those properties then no queries will be performed.

This is merely a convenient way to fetch the page data while reusing the logic between components. If you are interested on how this is done you can review the source code here.

Config

Context Parameter

This is the same object that Next.js provides in the getServerSideProps. You can read the list of parameters here.

GetNextServerSidePropsConfig Parameter

The second argument of getNextServerSideProps is of type GetNextServerSidePropsConfig and accepts the following parameters:

  • Page: The current page component. It can be any valid React Element with the following properties: query and variables.
  • notFound: The notFound boolean allows the page to return a 404 status and 404 Page. This is used by Next.js to force a page return a 404 even if there was a successfully generated page before.
  • redirect: The redirect object allows redirecting to internal and external resources. It should match the shape of { destination:
  • props: The props object is any other key value pairs of properties where each value is received by the Page component.

getNextServerSideProps Return Values

The getNextServerSideProps function returns an object that is required by the getServerSideProps function.