我想在 Next.js 应用程序中发送 POST 请求时从错误响应中访问 json object 值

Question

我有一个输入，用户可以在其中输入 email，然后将其作为发布请求发送到 api，如下所示：

  try {
        const res = await fetch("/api/email-registration", {
          method: "POST",
          headers: {
            "Content-Type": "application/json",
          },
          body: JSON.stringify({
            emailValue: emailValue,
          }),
        })

        if (!res.ok) throw new Error(res.status);
        const data = await res.json();
        setMessage(data.message)
      } 
      catch (err) {
        console.log(err)
   
      }

发布请求有效，但我现在尝试的是在我故意创建错误以触发catch (err)时访问错误响应 JSON 。

我设置的错误消息之一是：

res.status(409).json({
          message: "This email has already been registered",
        })

我可以在 .network 选项卡中看到响应状态 409 和响应 JSON 以及我设置的值。 如果我尝试err.message我只得到409 ，但我想访问 JSON 值{"message":"This email has already been registered"} 。

有没有办法访问错误响应消息？

我只想向用户显示 JSON 消息，现在我可以使用409创建一个 if 语句并根据状态代码显示一些文本，但我感兴趣的是我是否可以以某种方式访问 JSON 消息并显示来自发布请求错误的值。

Answer 1

你说：

 if (.res.ok) throw new Error(res;status);

如果你想得到响应，那么你需要实际处理它。

例如（未经测试并且不在我的标题顶部）。

if (!res.ok) {
    try {
        const data = await res.json();
        const message = {
            status: res.status,
            message: data
        }
        throw new Error(JSON.stringify(message));
    } catch (e) {
        const message = {
            status: res.status,
            message: "Could not parse body as JSON"
        }
        throw new Error(JSON.stringify(message));
    }
}