如何解决Nuxt 3 useFetch中的NS_BINDING_ABORTED？

Question

我在网络选项卡中多次收到此错误（调整视图大小后）：

TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11576:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  cause: ConnectTimeoutError: Connect Timeout Error
      at onConnectTimeout (node:internal/deps/undici/undici:8522:28)
      at node:internal/deps/undici/undici:8480:50
      at Immediate._onImmediate (node:internal/deps/undici/undici:8511:13)
      at process.processImmediate (node:internal/timers:476:21)
      at process.callbackTrampoline (node:internal/async_hooks:130:17) {
    code: 'UND_ERR_CONNECT_TIMEOUT'
  }
}

网络选项卡

FE

await useFetch('/api/test', {
  method: 'POST',
  body: bodyInfos,
});

服务器/API

// server/api/test.post.js

// post to db
await fetch(SUPABASE_URL, {
  method: 'POST',
  headers: {
   apikey: SUPABASE_KEY,
   Authorization: `Bearer ${SUPABASE_KEY}`,
   'Content-Type': 'application/json',
  },
  body: JSON.stringify(testData),
}).catch((e) => console.log(e));

背景

我正在构建一个分析工具，它可以在

onMounted

挂钩中向我的数据库触发事件。然而，由于这个网络错误，我的数据库被垃圾邮件淹没了数千个条目。我读到这只发生在 Firefox 中。但我在 Chrome 中也遇到这个问题。

我希望这个 api 调用只会发布一次，但在调整事件大小后，它只会再触发数十次，并用相同的条目填充我的数据库。

问题

• 我是否必须在标头中添加过期值以将初始调用发送到我的端点？
• 为什么会出现这个错误？

Answer 1

我已将

useFetch

更改为

$fetch

，现在可以正常运行，没有任何错误。