localhost fetch시 ECONNREFUSED 에러 해결하기

문제 상황

Next JS server component에서

로컬 개발 서버(ex localhost:8080)로 fetch를 통해 요청을 보내자 다음과 같은 에러가 발생했습니다.

Internal error: TypeError: fetch failed at Object.fetch

Cause: Error: connect ECONNREFUSED ::1:3004

개발 환경은 Next JS 14 버전(즉 node 18.17.0 이상).

 

해결 방안

처음에는 프론트단의 문제(혹은 Next server component의 문제..?)라 생각을 했었는데

fetch API 단에서 에러가 나는 걸 보고, 바로 구글링에 착수.

 

다음과 같은 이슈를 만날 수 있었습니다.

https://github.com/node-fetch/node-fetch/issues/1624

ECONNREFUSED on NodeJS 18 · Issue #1624 · node-fetch/node-fetch

Node 18.8.0 이상 버전에서 발생하는 문제이며...

fetch를 사용해 localhost로 요청을 보낼 경우 위와 같은 에러가 발생한다고 하네요.

 

해결 방안은 간단. localhost 대신 loopback ip 주소(127.0.0.1)로 요청하면 됩니다.

 

해당 이슈는 closed 되었는데... 아직까지도 동일 문제가 발생 중인 상황입니다 😵‍💫