Javascript NextJS:TypeError:无法读取属性'；json'；未定义的

我已将此代码保存到NextJS环境的pages文件夹中。它通过调用外部API Rest获取数据，并且由于

console.log（响应）而工作行通过控制台显示Json API响应。我遇到的问题是，我在浏览器中遇到以下错误：

TypeError:无法读取未定义的属性“json”

与该行代码对应：

const data=wait res.json（）

这是包含以下代码的完整文件：

import React from "react";
import fetch from "node-fetch";

const getFetch = async (invoicesUrl, params) => {
  fetch(invoicesUrl, params)
    .then((response) => {
      return response.json();
    })
    .then((response) => {
      console.log(response);
    })
    .catch((err) => {
      console.log(err);
    });
};

export const getServerSideProps = async () => {
  const invoicesUrl = "https://192.168.1.38/accounts/123456";
  const params = {
    method: "get",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
    },
  };
  const res = await getFetch(invoicesUrl, params);
  const data = await res.json();
  console.log("Data Json: ", data);

  return { props: { data } };
};


这是我在控制台看到的Json API响应：

{
  account: [
    {
      id: '7051321',
      type: 'probe',
      status: 'open',
      newAccount: [Object],
      lastDate: '2020-07-04',
      taxExcluded: [Object],
      totalRecover: [Object],
      documentLinks: []
    },
  ]
}

你知道我该怎么解决吗？
提前谢谢

更新
以下代码运行良好：

import React from "react";
import fetch from "node-fetch";

const getFetch = async (invoicesUrl, params) => {
   return fetch(invoicesUrl, params);
};

export const getServerSideProps = async () => {
  const invoicesUrl = "https://192.168.1.38/accounts/123456";
  const params = {
    method: "get",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
    },
  };
  try {
    const res = await getFetch(invoicesUrl, params);
    const data = await res.json();
    console.log("Data JSON: ", data);
    return { props: { data } };
  } catch (error) {
    console.log("Data ERROR: ", error);
  }
};


有几件事你必须改变

const getFetch=async（invoicessurl，params）=>{
获取（发票，参数）
。然后（（响应）=>{
返回response.json（）；
})
。然后（（响应）=>{
控制台日志（响应）；
return response；//1.添加此行，需要返回响应。
})
.catch（（错误）=>{
控制台日志（err）；
});
};
export const getServerSideProps=async（）=>{
const invoicessurl=”https://192.168.1.38/accounts/123456";
常量参数={
方法：“获取”，
标题：{
接受：“应用程序/json”，
“内容类型”：“应用程序/json”，
},
};
const data=wait getFetch（invoicessurl，params）；
//const data=await res.json（）；2.通过在getFetch中调用.json来删除已转换为json的内容
log（“Data Json:，Data）；//确保打印数据。
返回{props:{data}}；
};
返回语句的位置不正确。
当函数期望返回时。当语句不是在promise
then
函数中执行时，需要返回，因为它是一个异步回调函数，与
getFetch
函数中的语句不同步。我希望我已经把事情说清楚了。下面是将如何返回某些内容的代码

import React from "react";
import fetch from "node-fetch";

const getFetch = async (invoicesUrl, params) => {
  return fetch(invoicesUrl, params);
};

export const getServerSideProps = async () => {
  const invoicesUrl = "https://192.168.1.38/accounts/123456";
  const params = {
    method: "get",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
    },
  };
  try{
     const res = await getFetch(invoicesUrl, params);
     console.log("Data Json: ", res);
  }catch(error){
     console.log("Data Json: ", error);
  }
  return { props: { res } };
};

我已经做了您建议的更改，现在我得到了这个错误：“SerializableError:error Serialization
。数据
从“/invoicing/invoices”中的
getServerSideProps
返回。原因：
未定义的
无法序列化为JSON。请使用
null
或一起忽略此值”。getFetch函数中有两个“return”，对吗？原因是API返回的响应不可序列化。如果你用完整的对象更新你的问题，我将能够指出问题所在。如果没有，您可以在这里找到答案：好的，不可序列化的原因可能是控制台中有内容“[Object]”的元素，但如果我用另一种方式调用API（curl，Postman），则有内容。是的，[Object]中的某些元素是不可序列化的。对于NextJS，它需要是可序列化的。您可以使用以下方法：打印整个结构并查看问题所在。我很乐意帮助更多人。顺便说一句，我想我已经解决了这个问题的原始问题。如果是，请接受……：）谢谢你的帮助。我来看看那个链接。很抱歉，我不能接受你的答案是正确的（我不想让其他用户感到困惑），因为在我尝试了很多次后，它对我不起作用。我已经更新了我原来的问题，在更新标题后，我把代码放在适合我的地方。但是，可能有其他用户对此问题可以投票认为您的答案是正确的！再次感谢。好的，谢谢！它帮助了我。现在我的代码正在运行。我将用代码更新我的原始问题。然而，在这里，我建议您将“return{props:{data}}”更改为“return{props:{res}”。再次感谢。