Colton
Colton

Reputation: 218

Next.js getServerSideProps is always undefined

I've been starting with a new Next application and going with functional components instead of class-based wherever possible. Following the documentation, I've set up the following with no luck:

import React from 'react';
import { GetServerSideProps, InferGetServerSidePropsType } from 'next';

export const getServerSideProps: GetServerSideProps = async () => {
    return {
        props: {
            results: [1,2,3],
        },
    };
};

function Page({results}: InferGetServerSidePropsType<typeof getServerSideProps>) {
    console.log(results) // undefined
    return (
        <div className="app__page header">page here</div>
    )
}

export default Page;

Regardless of what I've tried I can't get any data back from getServerSideProps, any help would be greatly appreciated!

Upvotes: 3

Views: 13921

Answers (2)

Никитос
Никитос

Reputation: 391

Possible you used custom _app page (e.g pankod boilerplate), and it not provide correct ServerSideProps to component.

Also remember that current version of Next.js with custom _app currently does not support Next.js Data Fetching methods like getStaticProps or getServerSideProps.

Read more at https://nextjs.org/docs/advanced-features/custom-app

Upvotes: 2

Nikolai Kiselev
Nikolai Kiselev

Reputation: 6613

Nothing wrong with the code but it could be in a wrong place.

Make sure that is a Next.js page and located in pages directory as getServerSideProps only allowed in a page.

You should see printed [1,2,3] on server-side and in the browser console.

Upvotes: 5

Related Questions