[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.