NUXT 3尝试在尝试获取资源时返回NetworkError

发布于 2025-02-13 17:22:09 字数 5186 浏览 0 评论 0原文

我正在尝试从本地API检索数据。使用Postman时，我可以成功检索数据，但是当我在NUXT 3中使用“ usefetch”时，它会在尝试获取资源时返回网络ERNETERROR。

当我进行完全相同的呼叫时，但要进行免费在线测试API（ https：//jsonplaceholder.typicode.com/posts ）它确实有效。这让我认为可能很难连接到本地主机？

有人知道我如何解决这个问题吗？

await useFetch(() => 'localhost:8077/my-url-here', { method: 'POST' }).then((response) => {
    console.log(response)
})

在我的网络选项卡中，什么都没有显示，所以我真的不知道如何调试此问题。

尝试获取资源时的NetworkError。（）

这就是控制台日志中可见的。

还有另一个错误，但很长。

FetchError@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:6:5\ncreateFetchError@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:18:22\nonError@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:95:33\ncreateFetch/$fetchRaw2/ctx.response<@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:136:14\npromise callback*$fetchRaw2@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:131:58\n$fetch2@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:157:12\nuseFetch/asyncData<@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/fetch.mjs:28:12\nuseAsyncData/asyncData.refresh@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/asyncData.mjs:46:52\ninitialFetch@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/asyncData.mjs:68:40\nuseAsyncData@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/asyncData.mjs:80:7\nuseFetch@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/fetch.mjs:27:33\nsendRequest@http://localhost:3000/_nuxt/pages/keyword.vue?t=1657198726330:29:9\nasync*callWithErrorHandling@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:1365:18\ncallWithAsyncErrorHandling@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:1373:38\ninvoker@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:7434:33\nEventListener.handleEvent*addEventListener@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:7396:6\npatchEvent@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:7410:23\npatchProp@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:7461:17\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4901:21\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateSubTree@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5502:24\ncomponentUpdateFn@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5510:13\nrun@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:384:19\nsetupRenderEffect/instance.update@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5600:52\nsetupRenderEffect@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5608:5\nmountComponent@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5447:22\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4852:25\nhydrateSuspense@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:2392:29\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4875:33\nhydrateSubTree@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5502:24\n

原文

I am trying to retrieve data from my local API. I can succesfully retrieve data when using Postman but when I use "useFetch" inside my setup in Nuxt 3 it returns a NetworkError when attempting to fetch resource.

When I do the exact same call but to a free online test API (https://jsonplaceholder.typicode.com/posts) it does work. That makes me think that the useFetch has difficulty connecting to local host maybe?

Does anyone know how I can fix this?

await useFetch(() => 'localhost:8077/my-url-here', { method: 'POST' }).then((response) => {
    console.log(response)
})

In my network tab nothing shows up, so I don't really know how to debug this.

NetworkError when attempting to fetch resource. ()

That's what is visible in the console log.

Theres another error but its very long.

FetchError@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:6:5\ncreateFetchError@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:18:22\nonError@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:95:33\ncreateFetch/$fetchRaw2/ctx.response<@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:136:14\npromise callback*$fetchRaw2@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:131:58\n$fetch2@http://localhost:3000/_nuxt/node_modules/ohmyfetch/dist/chunks/fetch.mjs?v=9b9b31cd:157:12\nuseFetch/asyncData<@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/fetch.mjs:28:12\nuseAsyncData/asyncData.refresh@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/asyncData.mjs:46:52\ninitialFetch@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/asyncData.mjs:68:40\nuseAsyncData@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/asyncData.mjs:80:7\nuseFetch@http://localhost:3000/_nuxt/node_modules/nuxt/dist/app/composables/fetch.mjs:27:33\nsendRequest@http://localhost:3000/_nuxt/pages/keyword.vue?t=1657198726330:29:9\nasync*callWithErrorHandling@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:1365:18\ncallWithAsyncErrorHandling@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:1373:38\ninvoker@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:7434:33\nEventListener.handleEvent*addEventListener@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:7396:6\npatchEvent@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:7410:23\npatchProp@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:7461:17\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4901:21\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateChildren@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4950:16\nhydrateElement@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4918:35\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4847:24\nhydrateSubTree@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5502:24\ncomponentUpdateFn@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5510:13\nrun@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:384:19\nsetupRenderEffect/instance.update@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5600:52\nsetupRenderEffect@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5608:5\nmountComponent@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5447:22\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4852:25\nhydrateSuspense@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:2392:29\nhydrateNode@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:4875:33\nhydrateSubTree@http://localhost:3000/_nuxt/node_modules/.vite/deps/vue.js?v=9b9b31cd:5502:24\n

分享到QQ

分享到微博