getInitialProps is not called when visiting directly the page url in nextjs

Question

I have a nextjs app connected with redux (using withRedux) and my navigation is driven by a header, in which i use links for links to different parts of the page.

I'm implemented _app.js to set up the container, provider, withRedux and in the getInitialProps in _app.js i fetch a list of users by dispatching an action, and make the results available on the store.

it all works fine when i visit the home page, then i click on the link to the UserList. the dispatch call to load the users is done on getInitialProps in _app.js.

If i visit the route directly in the browser (localhost:3000/UserList) getInitialProps is not called and the UserList page is empty.

I don't know where to go from here, i've spent a day and a half.

Answer 1

Not sure if you are working with server, my case I am working with nextjs static site. In the NextJS documentation itself they mentioned

getInitialProps will only be executed on the client when navigating to a different route via the Link component or using the routing APIs

Means on server side getInitialProps is always called, but on client side navigating to URL directly doesn't work.

I am planning to use componentWillMount and Dynamic Import for the solution.

I will update if thing works.