英文:
Fetch request to PocketBase fails from terminal but works in Postman and the browser | Next.js13
问题
我正在使用create-next-app@latest
构建一个Next.js应用程序,将PocketBase用作数据库。
我的问题是,我的本地PocketBase实例拒绝来自我的NextJS应用程序的连接,但在使用Postman或浏览器获取数据时没有问题。问题似乎与undici
库有关,尽管我不确定它是否是问题的真正原因。
只有在尝试连接到localhost时,fetch请求似乎才会失败,但任何外部链接,如**google.com
**都可以正常工作。
以下是引起错误的代码片段:
async function getNotes(){
const res = await fetch('http://localhost:8090/api/collections/notes/records');
const data = res.json();
return data;
}
import PocketBase from 'pocketbase';
async function getNotes(){
const pb = new PocketBase('http://127.0.0.1:8090')
const list = await pb.collection('notes').getList(1, 100, {});
return list;
}
使用内置的fetch API时的错误日志:
TypeError: fetch failed
at Object.fetch (node:internal/deps/undici/undici:11457:11)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
cause: Error: connect ECONNREFUSED 127.0.0.1:8090
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1494:16)
at TCPConnectWrap.callbackTrampoline (node:internal/async_hooks:130:17) {
errno: -111,
code: 'ECONNREFUSED',
syscall: 'connect',
address: '127.0.0.1',
port: 8090
}
}
使用PocketBase ORM时的错误日志:
ClientResponseError 0: Something went wrong while processing your request.
at new ClientResponseError (webpack-internal:///(sc_server)/./node_modules/pocketbase/dist/pocketbase.es.mjs:161:23)
at eval (webpack-internal:///(sc_server)/./node_modules/pocketbase/dist/pocketbase.es.mjs:1619:39)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async getNotes (webpack-internal:///(sc_server)/./app/notes/page.tsx:21:22)
at async NotesPage (webpack-internal:///(sc_server)/./app/notes/page.tsx:31:19) {
url: '',
status: 0,
response: {},
isAbort: false,
originalError: 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 127.0.0.1:8090
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1574:16)
at TCPConnectWrap.callbackTrampoline (node:internal/async_hooks:130:17) {
errno: -111,
code: 'ECONNREFUSED',
syscall: 'connect',
address: '127.0.0.1',
port: 8090
}
}
}
使用**'node-fetch'** npm库时的错误日志(这次的错误日志不包括Undici):
FetchError: request to http://127.0.0.1:8090/api/collections/notes/records?page=1&perPage=30 failed, reason: connect ECONNREFUSED 127.0.0.1:8090
at ClientRequest.eval (webpack-internal:///(sc_server)/./node_modules/node-fetch/src/index.js:124:20)
at ClientRequest.emit (node:events:511:28)
at Socket.socketErrorListener (node:_http_client:495:9)
at Socket.emit (node:events:511:28)
at emitErrorNT (node:internal/streams/destroy:151:8)
at emitErrorCloseNT (node:internal/streams/destroy:116:3)
at process.processTicksAndRejections (node:internal/process/task_queues:82:21) {
type: 'system',
errno: 'ECONNREFUSED',
code: 'ECONNREFUSED',
erroredSysCall: 'connect'
}
我已经尝试了几乎我能找到的一切,例如:
- 更改Node版本并更新本地和全局npm包
- 使用第三方库,如'node-fetch'和'axios'连接到数据库。
- 在运行PocketBase后,使用PocketBase npm包(ORM)连接到数据库,然后使用fetch API。请注意,管理员面板运行正常。
- 在'http://localhost:....'和'http://127.0.0.1:...' URL之间进行切换产生完全相同的结果。
英文:
I'm building a Next.js app using create-next-app@latest
with PocketBase as the database.
My Problem is that my local PocketBase instance refuses the connection from my NextJS app, but has no problem retrieving data when I fetch it using Postman or the browser. The issue seems to have to do with the undici
library though I'm not certain if its the actual source of the issue.
The fetch request only seems to fail when I try connecting to localhost, but any external links such as google.com
work fine.
Here are the code snippets that cause the error
async function getNotes(){
const res = await fetch('http://localhost:8090/api/collections/notes/records');
const data = res.json();
return data;
}
import PocketBase from 'pocketbase';
async function getNotes(){
const pb = new PocketBase('http://127.0.0.1:8090')
const list = await pb.collection('notes').getList(1, 100, {});
return list;
}
Error log when using the built-in fetch API
TypeError: fetch failed
at Object.fetch (node:internal/deps/undici/undici:11457:11)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
cause: Error: connect ECONNREFUSED 127.0.0.1:8090
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1494:16)
at TCPConnectWrap.callbackTrampoline (node:internal/async_hooks:130:17) {
errno: -111,
code: 'ECONNREFUSED',
syscall: 'connect',
address: '127.0.0.1',
port: 8090
}
}
Error log when using the PocketBase ORM
ClientResponseError 0: Something went wrong while processing your request.
at new ClientResponseError (webpack-internal:///(sc_server)/./node_modules/pocketbase/dist/pocketbase.es.mjs:161:23)
at eval (webpack-internal:///(sc_server)/./node_modules/pocketbase/dist/pocketbase.es.mjs:1619:39)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async getNotes (webpack-internal:///(sc_server)/./app/notes/page.tsx:21:22)
at async NotesPage (webpack-internal:///(sc_server)/./app/notes/page.tsx:31:19) {
url: '',
status: 0,
response: {},
isAbort: false,
originalError: 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 127.0.0.1:8090
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1574:16)
at TCPConnectWrap.callbackTrampoline (node:internal/async_hooks:130:17) {
errno: -111,
code: 'ECONNREFUSED',
syscall: 'connect',
address: '127.0.0.1',
port: 8090
}
}
}
Error log when using the 'node-fetch' npm library (the error log doesn't include Undici this time)
FetchError: request to http://127.0.0.1:8090/api/collections/notes/records?page=1&perPage=30 failed, reason: connect ECONNREFUSED 127.0.0.1:8090
at ClientRequest.eval (webpack-internal:///(sc_server)/./node_modules/node-fetch/src/index.js:124:20)
at ClientRequest.emit (node:events:511:28)
at Socket.socketErrorListener (node:_http_client:495:9)
at Socket.emit (node:events:511:28)
at emitErrorNT (node:internal/streams/destroy:151:8)
at emitErrorCloseNT (node:internal/streams/destroy:116:3)
at process.processTicksAndRejections (node:internal/process/task_queues:82:21) {
type: 'system',
errno: 'ECONNREFUSED',
code: 'ECONNREFUSED',
erroredSysCall: 'connect'
}
I've tried just about everything I could find such as:
1. Changing node versions and updating local and global npm packages
2. Using 3rd party libraries such as 'node-fetch' and 'axios' to connect to the database.
3. Connecting to the database using the PocketBase npm package (ORM) and also using just the fetch API after running PocketBase. Note that the admin panel works fine.
4. Changing between http://localhost:....
and http://127.0.0.1:...
urls gives exactly the same results.
答案1
得分: 0
然而,似乎暂时切换到非基于 Chromium 的浏览器是一个有效的解决方法。
这是关于问题的更多信息的 GitHub 问题。
英文:
I wasn't able to pin point the source of the issue,
However, it seems that switching to a non-chromium based browser is a valid workaround for the time being
This is the github issue with more information about the problem
答案2
得分: 0
我认为这是由于最近版本的NextJS中行为变化所致。
检查是否为HOSTNAME环境变量设置了值。
如果是,并且它与localhost不同,节点将不会在本地地址(localhost)上打开端口,也不会通过本地IP(127.0.0.1)进行连接。您可以通过将HOSTNAME设置为"localhost"值进行测试。
英文:
I think this is due to the behavior change in recent versions of NextJS.
Check that there is a value set for the HOSTNAME environment variable.
If yes and it is different from localhost, the node will not open the port on the local address (localhost) and there will be no connection through the local IP (127.0.0.1). You can test by setting HOSTNAME with the "localhost" value.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论