framework
framework copied to clipboard
[unhandledRejection] Cannot set headers after they are sent to the client
[unhandledRejection] Cannot set headers after they are sent to the client
at new NodeError (node:internal/errors:372:5) at ServerResponse.setHeader (node:_http_outgoing:576:11) at sendError (/H:/nuxt%20projects/trademark/node_modules/h3/dist/index.mjs:216:13) at nodeHandler (/H:/nuxt%20projects/trademark/node_modules/h3/dist/index.mjs:375:15)
Due to a problem with dynamic imports, I moved all the resources of the application to the /public folder and now I constantly get this error, what could be the problem?
I'm getting a similar error in both Chrome (102.0.5005.63) & Firefox (100.0.2)
ERROR [unhandledRejection] Cannot set headers after they are sent to the client
at new NodeError (internal/errors.js:322:7)
at ServerResponse.setHeader (_http_outgoing.js:561:11)
at sendError (node_modules/h3/dist/index.mjs:216:13)
at nodeHandler (node_modules/h3/dist/index.mjs:375:15)
I'm not using a public folder. node: v14.19.2
"devDependencies": { "@nuxt/postcss8": "^1.1.3", "autoprefixer": "^10.4.7", "nuxt": "3.0.0-rc.3", "postcss": "^8.4.14" }, "dependencies": { "@nuxtjs/color-mode": "^3.0.3", "css-loader": "^6.7.1", "nes.css": "^2.3.0", "tailwindcss": "^3.0.24", "tailwindcss-dark-mode": "^1.1.7", }
What's also strange is the browser just randomly refreshes. There's a brief error when it happens, but the server rebuilds so fast I almost couldn't can't catch it in the console. Curse this blazingly fast server-side rendering! 🤣
I'm kind of wondering if this doesn't have something to due with remote debugging and forwarding ports on VS Code?
Edit:
I managed to catch the error by enabling Preserve Logs in Chrome & Firefox console settings. It looks like a websocket error coming from client.ts
Chrome:
client.ts:16 [vite] connecting...
runtime-core.esm-bundler.js:1331 <Suspense> is an experimental feature and its API will likely change.
client.ts:22 WebSocket connection to 'ws://localhost:24678/_nuxt/' failed: (anonymous) @ client:188
client.ts:219 [vite] server connection lost. polling for restart...
Fetch failed loading: GET "http://localhost:3000/_nuxt/__vite_ping".
waitForSuccessfulPing @ client:347
(anonymous) @ client:366
Navigated to http://localhost:3000/
Getting this error to... but it seems to be a firefox issue.
ERROR [unhandledRejection] Cannot set headers after they are sent to the client 11:05:14
at new NodeError (node:internal/errors:372:5) at ServerResponse.setHeader (node:_http_outgoing:576:11) at sendError (node_modules/h3/dist/index.mjs:216:13) at nodeHandler (node_modules/h3/dist/index.mjs:376:15)
node v16.15.0
"devDependencies": { "@intlify/nuxt3": "^0.2.2", "@nuxtjs/tailwindcss": "^5.1.2", "nuxt": "3.0.0-rc.3" }, "dependencies": { "@pinia/nuxt": "^0.1.9", "@stripe/stripe-js": "^1.31.0", "graphql": "^16.5.0", "pinia": "^2.0.14", "villus": "^1.1.0" }
Your Nuxt app si running inside Docker container?
Does anyone use AdGuard adblocker?
Does anyone use AdGuard adblocker?
I'm using Brave Adblock when i disable it, its doesnt giving any error. I think the adblock cause this error. I'm using rc4 by the way.
ERROR [unhandledRejection] Cannot set headers after they are sent to the client
at new NodeError (node:internal/errors:371:5)
at ServerResponse.setHeader (node:_http_outgoing:576:11)
at sendError (node_modules/h3/dist/index.mjs:219:13)
at nodeHandler (node_modules/h3/dist/index.mjs:378:15)
Does anyone use AdGuard adblocker?
I don't use blockers and I get this error
I'm getting the same error as @bitmonti, only on Firefox too. It appears twice when refreshing the page (CTRL+R).
ERROR [unhandledRejection] Cannot set headers after they are sent to the client
at new NodeError (node:internal/errors:372:5)
at ServerResponse.setHeader (node:_http_outgoing:576:11)
at sendError (/C:/Users/kobyf/Dev/idb/node_modules/h3/dist/index.mjs:216:13)
at nodeHandler (/C:/Users/kobyf/Dev/idb/node_modules/h3/dist/index.mjs:375:15)
`Node v16.15.0`
"devDependencies": {
"nuxt": "3.0.0-rc.3"
},
"dependencies": {
"@pinia/nuxt": "^0.1.9",
"pinia": "^2.0.14",
"sass": "^1.52.0",
"sass-loader": "^13.0.0"
}
I removed package-lock.json and node_modules. Than updated nuxt version "3.0.0-rc.3" to "3.0.0-rc.4".
This solved the problem for me.
For me too, thanks !
i'm still having this issue with rc4.
I deleted the package lock file, the node_modules and the .nuxt directory. Then I installed the packages.
My nuxt entry in package.json
is the following "nuxt": "npm:nuxt3@latest"
.
The problem still persists. I m using firefox developer edition.
still persists for me (running inside Docker)
I'm also having this issue on Safari 15.5 (running on Mac OS Monterey).
I have same issue. For me this error is shown only in development mode in docker using https I run Nuxt in docker with HTTPS proxy (via nginx in docker).
I figured out that error is thrown when using useHead()
for links
in component or setting app.head.link
in nuxt.config.ts
.
Does not matter if links files are from nuxt or from external URL
docker-compose.yaml
version: '3.8'
services:
app:
container_name: my-app
build: .
command:
- sleep
- '9999999999'
ports:
- '80:80'
volumes:
- .:/app:cached
https-proxy:
container_name: my-app-https-proxy
image: nginx
volumes:
- './https-proxy-cert.cert:/var/https-proxy-cert.cert'
- './https-proxy-cert.key:/var/https-proxy-cert.key'
- './https-proxy.conf:/etc/nginx/conf.d/http-proxy.conf'
ports:
- '443:443'
- '24678:24678'
volumes:
node_modules:
https-proxy.conf
server {
listen 443 ssl http2;
server_name _;
location / {
proxy_pass http://app:80;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
ssl_protocols TLSv1.2;
ssl_certificate /var/https-proxy-cert.cert;
ssl_certificate_key /var/https-proxy-cert.key;
access_log /dev/stdout;
error_log /dev/stderr;
}
server {
listen 24678 ssl http2;
server_name _;
location / {
proxy_pass http://app:24678;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}
ssl_protocols TLSv1.2;
ssl_certificate /var/https-proxy-cert.cert;
ssl_certificate_key /var/https-proxy-cert.key;
access_log /dev/stdout;
error_log /dev/stderr;
}
I have the same problem
I'm not using useHead() or app.head.link. Error still exists.
I'm not using useHead() or app.head.link. Error still exists.
I assume the problem is more related to having pointers to external resources via Https than the useHead
composable. Try maybe to comment out these external <link>
s or <img>
s, and see whether the problem disappears :)
I'm not using any external resources either on links or images in any place of the app.
Working on a more or less fresh install of Nuxt rc4. But as you said, the error could be thrown by i18next related http requests.
{
"private": true,
"scripts": {
"build": "nuxt build",
"dev": "nuxt dev -p 3002",
"generate": "nuxt generate",
"preview": "nuxt preview"
},
"devDependencies": {
"nuxt": "3.0.0-rc.4"
},
"dependencies": {
"@nuxtjs/tailwindcss": "^5.1.2",
"@pinia/nuxt": "^0.1.9",
"i18next": "^21.8.10",
"i18next-browser-languagedetector": "^6.1.4",
"i18next-http-backend": "^1.4.1"
}
}
@danielroe after upgrade to latest nitropack, now working for me 👍🏼
I'm using RC5 and the instant I add a file to the /public directory (like my favicon.ico file), I receive this error.
[unhandledRejection] Cannot set headers after they are sent to the client
I'm also facing this issue. (on rc.6)
I've tried various solutions mentioned above but none seem to resolve. I do notice that its somewhat sporadic (Possibly why some users are saying it has resolved the issue).
I haven't determined where the failure is, or whether a manual restart of nuxt is required to verify if a solution has any effect.
I'm also facing this issue. (on rc.6)
I've tried various solutions mentioned above but none seem to resolve. I do notice that its somewhat sporadic (Possibly why some users are saying it has resolved the issue).
I haven't determined where the failure is, or whether a manual restart of nuxt is required to verify if a solution has any effect.
It seems it only appears at development time, so it shouldn't be a big issue anyway.
Any updates about this issue :( ?
I'm also facing this issue.
"nuxt": "3.0.0rc.6"
Same here, it happens randomly but it more often seems triggered when I use useCookie
in a plugin or route middleware (though not every time, and I think it also happened when using it in a component at one point).
This one is very hard to pin down because I can't find a reliable trigger. Sometimes it happens when a 500 error is triggered, sometimes it happens without apparent causes. I'm on 3.0.0-rc.8 and running straight on my machine, not in a Docker container.
This is triggered when code modifies the headers of a response after the response has already been made. For example, you are redirecting within a setTimeout
on server. Or It is possible to be triggered by user error, or of course it could be a bug in nitro/nuxt. I would need to see a reproduction to tell which is the cause.
I suspect it may be caused by an error somewhere, it would make more sense than the others because I'm pretty sure I'm not doing any of that myself. However, I can't get enough logging to know for sure. Any time this happens, I only get a laconic 500 no-can-do error and no context.
I don't suppose useCookie
or parseCookies
do try to set cookies, right? Although, on occasion, I get a "can't read value X of undefined
" apparently on these two calls, and it turns out the undefined
part is the cookies themselves (as in: there is nothing to parse). I can circumvent this with a definedness check, but it would be good to figure out why this may happen. Should I open a bug in Nitro or H3?
Yes, the (vue app composable) useCookie
will try to set a cookie if the value has changed from the initial value. I'm very happy for you to comment here with a reproduction, but it's probably a nuxt issue if there's a problem with the vue app composable.
I couldn't reproduce it on an MRE but it doesn't look like it's useCookie
trying to set a cookie at the wrong time. I get this error on the server's console instead
ERROR [unhandledRejection] Cannot set headers after they are sent to the client 20:16:37
at new NodeError (node:internal/errors:377:5)
at ServerResponse.setHeader (node:_http_outgoing:595:11)
at sendError (node_modules/h3/dist/index.mjs:287:13)
at nodeHandler (node_modules/h3/dist/index.mjs:450:15)
which points me to node_modules/h3/dist/index.mjs:287:13
which is
event.res.statusCode = h3Error.statusCode;
event.res.statusMessage = h3Error.statusMessage;
event.res.setHeader("Content-Type", MIMES.json); // <--- setHeader is is at 287:13 precisely
event.res.end(JSON.stringify(responseBody, null, 2));
but I can't get any more out of this. Would there be a way of getting more debug logging perhaps?
Reproduction for a way of triggering this: https://stackblitz.com/edit/github-u3et7v. HT: @benjamincanac.