类型错误：主体不可用 - NextJS 服务器操作 POST

Question

我在客户端组件中使用 NextJS v14.1.0 和服务器操作。我收到了正确的消息，但也收到了一个 TypeError 消息，表明 body 不可用。

src/app/auth/account-verification/page.tsx

const onSubmit = async (e: FormEvent<HTMLFormElement>) => {
    e.preventDefault();
    const data = { requestId: token, otp: parseInt(otp) };
    const response = await AccountVeficationAction(data);
    ActionResponseHandler(response, "Account Verification");
    if (response.success) {
      Router.push("/auth/login");
    }
  };

/src/app/auth/_utils/actions/action.ts

export const AccountVeficationAction = async (body: any) => {
  try {
    const response = await fetch(`${BASEURL}/auth/confirm-account`, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        // Add other necessary headers (e.g., authorization)
      },
      body: JSON.stringify(body), // Access data from the request body
    });
    console.log(await response.json());
    return await response.json();
  } catch (error) {
    console.log(error);
    return {
      success: false,
      message: "Something went wrong!",
    };
  }
};

现在，当我在提交提取时使用 /account-verification/page.tsx 中的 AccountVerificationAction 函数时，可以按预期工作。但是，我没有任何关于从我得到的地方获得成功或正确响应的信息： TypeError: Body is unuable

这是我得到的：

{
  success: true,
  message: 'Confirmed successfully. Account is activated now.',
  statusCode: 200
}
TypeError: Body is unusable
    at specConsumeBody (node:internal/deps/undici/undici:4521:15)
    at _Response.json (node:internal/deps/undici/undici:4425:18)
    at AccountVeficationAction (webpack-internal:///(action-browser)/./src/app/auth/_utils/actions/actions.ts:76:31)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:39:406
    at async t4 (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:38:6379)
    at async rk (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\compiled\next-server\app-page.runtime.dev.js:39:25934)
    at async doRender (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\base-server.js:1394:30)    
    at async cacheEntry.responseCache.get.routeKind (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\base-server.js:1555:28)
    at async DevServer.renderToResponseWithComponentsImpl (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\base-server.js:1463:28)
    at async DevServer.renderPageComponent (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\base-server.js:1856:24)
    at async DevServer.renderToResponseImpl (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\base-server.js:1894:32)
    at async DevServer.pipeImpl (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\base-server.js:911:25)
    at async NextNodeServer.handleCatchallRenderRequest (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\next-server.js:271:17)
    at async DevServer.handleRequestImpl (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\base-server.js:807:17)
    at async C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\dev\next-dev-server.js:331:20        
    at async Span.traceAsyncFn (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\trace\trace.js:151:20)   
    at async DevServer.handleRequest (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\dev\next-dev-server.js:328:24)
    at async invokeRender (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\lib\router-server.js:163:21)
    at async handleRequest (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\lib\router-server.js:342:24)
    at async requestHandlerImpl (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\lib\router-server.js:366:13)
    at async Server.requestListener (C:\Works\Programming\CrescentsStack\deinhandymarkt\node_modules\.pnpm\next@14.1.0_@babel+core@7.23.7_react-dom@18.2.0_react@18.2.0_sass@1.70.0\node_modules\next\dist\server\lib\start-server.js:140:13)

到目前为止我不知道该怎么办。

Answer 1

看来你打了res.json()两次电话。该流在第一个流之后已被消耗。将结果存储在变量中并使用它来log提供返回值。IE

console.log(await response.json());
return await response.json();

到

const responseBody = await response.json();
console.log(responseBody);
return responseBody;