Fetch of local server gives ECONNREFUSED

[teinett]

Astro Info

Astro                    v3.6.4
Node                     v18.18.1
System                   macOS (arm64)
Package Manager          npm
Output                   server
Adapter                  @astrojs/node
Integrations             @astrojs/sitemap
                         @astrojs/react

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

I created almost empty project - it's template for my other projects.

I installed StrapiJS admin and requested its API: http://localhost:1337/api/posts

EXPECTED:

• AstroJS, browser and Postman give me the correct answer with list of posts.

GOT THE ERROR:

• Astro fetch request.
• Browser and Postman works fine.

Code of page src/pages/index.astro

---
import Layout from "@/layouts/Layout.astro";

const NODE_ENV = import.meta.env.NODE_ENV;

const link = "http://localhost:1337/api/posts";
const response = await fetch(link);
const data = await response.json();
console.log("test data from link", data);
---

<Layout homepage>
    <div class="container">
        <h1>Main Page</h1>
        <p>NODE_ENV = {NODE_ENV}</p>
    </div>
</Layout>

I tried:

• const link = "https://catfact.ninja/breeds"; - RESULT is okey
• const link = "http://localhost:1337/api/posts"; - ERROR

I tried to use this answer in AstroJS: src/pages/index.astro with fetch request and got error:

 error   fetch failed
  File:
    /Users/teine/Development/landing-template/src/pages/index.astro:7:18
  Code:
    6 | const link = "http://localhost:1337/api/posts";
    > 7 | const response = await fetch(link);
        |                  ^
      8 | const data = await response.json();
      9 | console.log("test data from link", data);
      10 | ---
  Stacktrace:
TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11576:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async eval (/Users/teine/Development/landing-template/src/pages/index.astro:7:18)
    at async callComponentAsTemplateResultOrResponse (file:///Users/teine/Development/landing-template/node_modules/astro/dist/runtime/server/render/astro/render.js:85:25)
    at async renderToReadableStream (file:///Users/teine/Development/landing-template/node_modules/astro/dist/runtime/server/render/astro/render.js:35:26)
    at async renderPage (file:///Users/teine/Development/landing-template/node_modules/astro/dist/runtime/server/render/page.js:29:12)
    at async renderPage (file:///Users/teine/Development/landing-template/node_modules/astro/dist/core/render/core.js:56:20)
    at async #tryRenderRoute (file:///Users/teine/Development/landing-template/node_modules/astro/dist/core/pipeline.js:115:18)
    at async DevPipeline.renderRoute (file:///Users/teine/Development/landing-template/node_modules/astro/dist/core/pipeline.js:58:20)
    at async handleRoute (file:///Users/teine/Development/landing-template/node_modules/astro/dist/vite-plugin-astro-server/route.js:229:18)

  Cause:
Error: connect ECONNREFUSED ::1:1337
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1555:16)

Screenshots of correct answer of API are attached:

Postman

Firefox

What's the expected result?

I extected to receive the json list of posts, as it is in browser and Postman.

Link to Minimal Reproducible Example

no, as it request only published URL, not local one

Participation

• [ ] I am willing to submit a pull request for this issue.

[lilnasy]

Thanks for the detailed report. I would be surprised if the issue turns out to be caused by Astro. The fetch function is now built-in to Node, which seems to be unable to connect to your strapi server. Are either of the two servers running with a container?

[teinett]

Are either of the two servers running with a container?

No, I don't use containers for this project.

[lilnasy]

Can you check if this command works?

node --eval "fetch('http://localhost:1337/api/posts')"

[teinett]

Result of node --eval "fetch('http://localhost:1337/api/posts')"

➜  landing-template git:(master) ✗ node --eval "fetch('http://localhost:1337/api/posts')"
node:internal/deps/undici/undici:11576
    Error.captureStackTrace(err, this);
          ^

TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11576:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  cause: Error: connect ECONNREFUSED ::1:1337
      at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1555:16) {
    errno: -61,
    code: 'ECONNREFUSED',
    syscall: 'connect',
    address: '::1',
    port: 1337
  }
}

Node.js v18.18.1
➜  landing-template git:(master) ✗

[bis0072]

use "http://127.0.0.1:1337/api/posts" instead of "http://localhost:1337/api/posts"

[teinett]

use "http://127.0.0.1:1337/api/posts" instead of "http://localhost:1337/api/posts"

Yes, it works now! Thanks a lot!