我在做一些非常简单的事情,似乎找不到一个直接的答案。
我有一个API路由:
// /api/test/route.js
export async function GET(request, response) {
console.log("requested");
return NextResponse.json({ my: "data" });
}
字符串
还有一个组件,它在单击按钮时向端点发出请求(我故意将头文件放入其中以解决问题):
// /components/client/test.js
"use client";
export default function ExampleClientComponent({children}) {
async function handleClick() {
let data = await fetch("http://localhost:3000/api/test", {
method: "GET",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
},
});
console.log("data", data);
}
return (
<>
<button onClick={handleClick}>Go</button>
</>
);
}
型
当点击按钮时,我通过控制台日志看到确认请求已发出,并在浏览器中获得以下200响应。正文是一个ReadableStrea
m,从我所读到的是HTTP响应的默认响应。但是,我对NextResponse
的理解是,它应该以JSON的形式返回响应。
Response
body: ReadableStream {locked: false}
bodyUsed: false
headers: Headers {append: function, delete: function, get: function, has: function, set: function, …}
ok: true
redirected: false
status: 200
statusText: "OK"
type: "basic"
url: "http://localhost:3000/api/test"
型
当我测试结束点时,我得到一个JSON体
HTTP/1.1 200 OK
connection: close
content-encoding: gzip
content-type: application/json
date: Tue, 25 Jul 2023 23:15:42 GMT
transfer-encoding: chunked
vary: RSC, Next-Router-State-Tree, Next-Router-Prefetch, Accept-Encoding
{
"my": "data"
}
型
这是怎么回事我读过的教程和文档(诚然与POST请求有关,而不是GET)似乎表明这是可行的。我期望的结果是请求返回一个带有JSON主体的响应。
1条答案
按热度按时间yruzcnhs1#
fetch()方法返回Promise。如果您想从端点访问响应,可以这样做。
字符串
如果你想了解更多,这里有一个链接到文档。
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch