Using Apollo's useQuery with getServerSideProps

[bwesner]

I'm trying to change code with getInitialProps to use getServerSideProps. I have something like:

const ObjPage = ({ objId }: Props): JSX.Element => {
    const { loading, error, data } = useQuery(LoadObj, {
        query: LoadObj,
        variables: { objId}
    });

    if (loading) {
        return <>Loading...</>;
    }

    if (!data || error) {
        return <ErrorPage statusCode={500} />;
    }

    ...go on to render the page
};

ObjPage.getInitialProps = async (context: Context): Promise<Props> => {
    const { query: { objId } } = context;

    return {
        objId: objId as string
    };
};

This works fine for both client and SSR. When I simply change the getInitialProps to getServerSideProps everything breaks because objId is now undefined. How do I get this to work?

[brianlovin]

Are you using dynamic pages (e.g. /page/[objId].tsx)? If so, I think that the objId was moved to context.params

https://nextjs.org/docs/basic-features/data-fetching#getserversideprops-server-side-rendering

Obviously ignore if you are indeed using query parameters and this is still breaking :)

[brianlovin]

Ahh, good call on exporting the function instead of attaching it. Totally glanced over that.

[githubjosh]

@bwesner any luck?

I've been struggling with this issue for a couple of days.

[bwesner]

@githubjosh i'm kinda just waiting for someone to update that with-apollo example to support getServerSideProps haha. I took a crack at it but couldn't get it to work. I might try again later if nobody else has updated it

[HaNdTriX]

@bwesner afaik getServerSideProps doesn't support AppTree-Traversal. This means using apollo methods like getDataFromTree is not possible.

Instead you should restructure your app to support fragments. Those can then be queried inside getServerSideProps without having to traverse the entire AppTree multiple times.

[renato]

@HaNdTriX What do you mean by "support fragments"? Looks like we need to explicitly use apolloClient.query on getServerSideProps, is that so?