Internal error: TypeError: fetch failed

[Soham-2224]

I've cloned this repo and installed required packages, but theres an error regarding the fetch request.
I've googled alot about this undici error, but alot of them talk about downgrading either next.js version to v13 or nodejs to v18.
whats the node version you are using, cause you did'nt have an issue with the fetch.

[Soham-2224]

This is the error
⨯ Internal error: TypeError: fetch failed
at Object.fetch (node:internal/deps/undici/undici:11372:11)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Cause: Error: read ECONNRESET
at TLSWrap.onStreamRead (node:internal/stream_base_commons:217:20)
at TLSWrap.callbackTrampoline (node:internal/async_hooks:130:17) {
errno: -4077,
code: 'ECONNRESET',
syscall: 'read'
}

[Soham-2224]

i've tried downgrading nodejs to v18 but that doesnt run nextjs 14,
and also tried downgrading next.js to v13 which works but i wanted to work with next14

[marpstar]

See vercel/next.js#51605

[Soham-2224]

@marpstar i've gone through your link, but could'nt find any solutions for it?
did it work for you with same version as i mentioned?
or did you downgrade to next v13?

[marpstar]

@Soham-2224 I don't have a solution other than launching via next dev instead of next start -- something with running in production triggers some low-level node issue? I still don't have a clear understanding of the root problem; just wanted to point you in the right direction.

[Soham-2224]

Thanks for your help @marpstar appreciate it✌.
I wonder though, how sonny's worked during the live stream🤔

[marpstar]

Thanks for your help @marpstar appreciate it✌. I wonder though, how sonny's worked during the live stream🤔

in my opinion, there's gotta be some other environmental issue that hasn't been pinpointed. not EVERYONE has issues; if more people did these issues would be a lot more visible.

[nahomjc]

The error you're encountering seems to be related to the undici package, which is a HTTP/1.1 client for Node.js. This error often occurs due to issues with the server you're trying to connect to, network problems, or compatibility issues between undici and the version of Node.js you're using.

the error could be due to a specific version of undici. The user reported that the test failed with undici version 5.11.0 and worked with undici version 5.12.0 and above. Therefore, you may want to try updating your undici version to resolve this issue. You can update it using the following command: npm install undici@latest Lastly, the error might be due to compatibility issues between undici and the version of Node.js you're using, you said that the test failed with Node.js version 18.12.1 and worked with Node.js version 18.3.0 and above. Therefore, you might want to consider upgrading your Node.js version.

To upgrade Node.js, you can use the following commands:
npm cache clean -f
npm install -g n
n stable
`

[Soham-2224]

Here i'll give all the versions and setup -

my package.json

{
    "name": "tvapp-new",
    "version": "0.1.0",
    "private": true,
    "scripts": {
        "dev": "next dev",
        "build": "next build",
        "start": "next start",
        "lint": "next lint"
    },
    "dependencies": {
        "@radix-ui/react-alert-dialog": "^1.0.5",
        "@radix-ui/react-aspect-ratio": "^1.0.3",
        "@radix-ui/react-avatar": "^1.0.4",
        "@radix-ui/react-dialog": "^1.0.5",
        "@radix-ui/react-dropdown-menu": "^2.0.6",
        "@radix-ui/react-label": "^2.0.2",
        "@radix-ui/react-scroll-area": "^1.0.5",
        "@radix-ui/react-select": "^2.0.0",
        "@radix-ui/react-separator": "^1.0.3",
        "@radix-ui/react-slot": "^1.0.2",
        "@radix-ui/react-tabs": "^1.0.4",
        "@radix-ui/react-toast": "^1.1.5",
        "@rehooks/local-storage": "^2.4.5",
        "@teamhanko/hanko-elements": "^0.9.1",
        "class-variance-authority": "^0.7.0",
        "clsx": "^2.0.0",
        "embla-carousel-autoplay": "8.0.0-rc15",
        "embla-carousel-react": "8.0.0-rc15",
        "embla-carousel-wheel-gestures": "8.0.0-rc05",
        "jose": "^5.1.3",
        "lucide-react": "^0.298.0",
        "next": "14.0.4",
        "next-themes": "^0.2.1",
        "react": "^18",
        "react-dom": "^18",
        "react-lite-youtube-embed": "^2.4.0",
        "sonner": "^1.2.4",
        "tailwind-merge": "^2.1.0",
        "tailwindcss-animate": "^1.0.7",
        "zustand": "^4.4.7"
    },
    "devDependencies": {
        "@types/node": "^20",
        "@types/react": "^18",
        "@types/react-dom": "^18",
        "autoprefixer": "^10.0.1",
        "postcss": "^8",
        "tailwindcss": "^3.3.0",
        "typescript": "^5"
    }
}

node.js version- v20.10.0
pnpm version- v8.14.0

the error i'm facing-

TypeError: fetch failed
at Object.fetch (node:internal/deps/undici/undici:11730:11)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
cause: Error: read ECONNRESET
at TLSWrap.onStreamRead (node:internal/stream_base_commons:217:20)
at TLSWrap.callbackTrampoline (node:internal/async_hooks:130:17) {
errno: -4077,
code: 'ECONNRESET',
syscall: 'read'
}
}

[Soham-2224]

Issue Solved!

Hi everyone, I'm happy to report that I've found the root cause of the fetch API error in Next.js 14, and it turns out to be a simple (but annoyingly elusive) mistake on my part.

The issue was actually in my TMDB app URL setting. I had accidentally entered http://localhost:3000 without the trailing slash, which was causing the requests to fail. Adding the slash (http://localhost:3000/) resolved the issue completely.

I'm really grateful for the help and suggestions you all provided (@marpstar , @nahomjc ) . They definitely helped me narrow down the problem and approach it from different angles.

I wanted to share this resolution as a reminder that sometimes the most frustrating bugs can stem from the most overlooked details. As developers, we can often get caught up in complex code and theories, but it's always worth taking a step back and checking the basics, even if they seem too simple to be the problem.

Thank you again for your time and assistance!