0

I have getServerSideProps in a page, eg index.tsx. (Not in a component like these problems)

...and it is exported (This is not like this problem)

Here's the basic code structure

index.tsx:

import processRequest from '../lib/processRequest';

const Index = ({ otherStuffPassedFrom_appjs, data }) => {
  console.log(data) // undefined
  return (
    <div>
      {data}
    </div>
  )
}

export async function getServerSideProps(context) {
  const data = await processRequest(...stuff extracted from the context);
  console.log(data); // data exists here
  return { props : {data} };
}

The weirdest thing is that if I put a breakpoint on the return { props : {data} }; line, and then run manually from there, the data shows up in the client's console.log().

processRequest is a complex function with many async await calls to APIs and a firestore DB and I'm not able to share the details. processRequest must be run on multiple pages, which is why I put in a lib file.

I have checked that awaits are applied to all async function calls in processRequest and descendant function calls.

Grateful for any clues on how to debug or what more to try out.

UPDATE:

I found the conflicting code, I think. I also had

_app.tsx:

import { useRouter } from "../node_modules/next/router";

function MyApp({ Component, pageProps }) {

  const router = useRouter();
  if (route contained particular query string) {
    router.replace(router.basePath); // remove the query string
  }
  ...
  return (
    <Component {...{ ...pageProps }} />
  );
}

processRequest does stuff particularly when this query string is present, so the effect of the code above is to process the query string, and then remove it.

Both the client and server console.logs were happening twice, the first on the server had data, but the second was undefined.

When I removed the router.replace the client was reporting the console.log on the first call (undefined on the second, which was after the query string was removed, as expected).

Incidentally, it calls the client console.log 6 times if I put the router.replace in index.js instead: 2 times with data and 4 undefined.

So is this a bug with _app and router.replace?

juliomalves
  • 42,130
  • 20
  • 150
  • 146
poshest
  • 4,157
  • 2
  • 26
  • 37
  • if you `console.log(data)` after `const data = await processRequest()` is the data object is defined ? – Ahmed Sbai Jan 25 '23 at 13:36
  • good question @AhmedSbai, yes it does. I updated the question to reflect that. – poshest Jan 25 '23 at 13:55
  • try to return a simple object as props like `{a: 'aa', b: 'bb'}` and see if it does not work try to change `data` to `myData` for example maybe the compont is reciving another data I don't know but your code is simple and should work – Ahmed Sbai Jan 25 '23 at 14:10
  • I updated the question after further findings prompted by your question, @AhmedSbai – poshest Jan 25 '23 at 14:23

0 Answers0