next-routes
next-routes copied to clipboard
Bug with getServerSideProps
I found a bug with this package. I have a page pages/Dashboard
and added a custom route:
routes.add('dashboard', '/painel', 'Dashboard')
In my component I export the getServerSideProps
with empty props. But when I navigate between pages, in the pages I setup getServerSideProps
calls http://localhost:3000/_next/data/development/painel.json
.
The painel.json
doesn't exists because actually the page is dashboard.json
in Next.js.
I'm trying to find a way to rewrite the call to dashboard.json
or redirect it in Express side, but no success yet.
Well, my temporary fix is the following:
On my server.ts
:
import customRoutes from './routes'
//...
server.get(/(\/_next\/data\/\w+)([\w/]+)(\.json|\.js)/, function (
req: Request,
res: Response,
next: NextFunction,
) {
const { '0': start, '1': page, '2': ext } = req.params
for (const route of customRoutes) {
const regexp = pathToRegexp(route.pattern)
if (page.match(regexp)) {
return res.redirect(`${start}/${route.page}${ext}`)
}
}
next()
})
This should come first of everything after starting the Express server to intercept all JSON and JS calls. It will match the environment and the custom path you setup.
My routes will look like this:
export const customRoutes = [
{
name: 'custom-path',
pattern: '/any/custom/path',
page: 'YourPage',
},
]
Basically Next will call http://localhost:3000/_next/data/development/any/custom/path.json
that will be 404, but the middleware will redirect to http://localhost:3000/_next/data/development/YourPage.json
, that will return the correct data.
+1