next.js: Custom server renderToHTML does not work with next 13.4
Link to the code that reproduces this issue or a replay of the bug
https://github.com/thilohaas/nextjs-custom-server/tree/main https://codesandbox.io/p/github/thilohaas/nextjs-custom-server/main
To Reproduce
- Start a new nextjs project with
npx create-next-app@latest - Add a server.js
const { createServer } = require('http');
const { parse } = require('url');
const next = require('next');
const dev = process.env.NODE_ENV !== "production";
const hostname = 'localhost';
const port = process.env.PORT || 3001;
// when using middleware `hostname` and `port` must be provided below
const app = next({ hostname, port, dev });
const handle = app.getRequestHandler();
app.prepare().then(() => {
createServer(async (req, res) => {
try {
const parsedUrl = parse(req.url, true);
const { pathname, query } = parsedUrl;
if (pathname.startsWith('/_next') || pathname.startsWith('/__next')) {
await handle(req, res, parsedUrl);
} else {
const html = await app.renderToHTML(req, res, pathname, query);
res.end(html);
}
} catch (err) {
console.error('Error occurred handling', req.url, err);
res.statusCode = 500;
res.end('internal server error');
}
}).listen(port, (err) => {
if (err) throw err;
console.log(`> Ready on http://${hostname}:${port}`);
});
});
- Change the package.json dev script to:
"dev": "node server.js", - run
npm run dev - open http://localhost:3001
Current vs. Expected behavior
I expect it to display the welcome page but instead i get an error from the next server:
Error: Invariant ensurePage called outside render worker
Verify canary release
- I verified that the issue exists in the latest Next.js canary release
Provide environment information
Operating System:
Platform: linux
Arch: x64
Version: #1 SMP PREEMPT_DYNAMIC Sun Aug 6 20:05:33 UTC 2023
Binaries:
Node: 16.17.0
npm: 8.15.0
Yarn: 1.22.19
pnpm: 7.1.0
Relevant Packages:
next: 13.4.20-canary.16
eslint-config-next: N/A
react: 18.2.0
react-dom: 18.2.0
typescript: 5.1.3
Next.js Config:
output: N/A
Which area(s) are affected? (Select all that apply)
Not sure
Additional context
No response
About this issue
- Original URL
- State: open
- Created 10 months ago
- Reactions: 28
- Comments: 22 (1 by maintainers)
Commits related to this issue
- UI: SSR example that works client side but not on server This is due to NextJS bug: https://github.com/vercel/next.js/issues/54977 — committed to klevultd/frontend-sdk by rallu 7 months ago
- UI: SSR example that works client side but not on server This is due to NextJS bug: https://github.com/vercel/next.js/issues/54977 — committed to klevultd/frontend-sdk by rallu 7 months ago
We are having the same issue with a custom Express server
do not use custom next serve. manage routers via next.config.js
For me this problem is also related to this one: https://github.com/vercel/next.js/issues/53466 Obstacles have appeared in large projects with their own infrastructure (Kube). These problems are associated with the use of Custom-Server, which is a great need for additional collection of metrics, custom logging, control of response headers and status, etc. I also need the ability to run in one thread so that the
AsyncLocalStoragecontext is saved and other global mechanics work.On versions higher than
13.4.12(I confirm, the problem appears with13.4.13-canary.0) it became impossible to create a custom-server. Now when calling methods, and even render, I get errors when calling server methods:Invariant ... called outside render worker.The Next server is initializing, but it seems to be isolated from my Fastify server, or the new code is broken. @ijjk It seems to me that you added these changes that affected an important part of the community.
Same problem here with custom server + renderToHTML + hydrate components 😞 any temporary solution?
Same error here (Next 14. while trying to work with Hydrate and Stencil (Web Components).
TypeError: Cannot read properties of undefined (reading 'ensurePage')I solved my problem by managing the routes in next.config.js
@salman-mazhar We are waiting for @ijjk.
@duzgunemreozkan yeah, you mentioned.
Maybe you might elaborate on how you are able to replicate the functionality of Express in the next.config.js, that would be helpful
I have a same problem with next 14.1.0 with custom server. Any update for this issue ?