GraphQL 返回错误数据时的解决方案-JavaScript中文网-JavaScript教程资源分享门户

GraphQL 是一种用于API的查询语言，它通过定义API的类型系统来使客户端能够精确地获取所需的数据。在前端开发中，GraphQL 可以作为一种非常有用的工具，帮助我们避免在网络请求中返回过多或不必要的数据。但是，当 GraphQL API 返回错误数据时该怎么办呢？本文将讨论 GraphQL 返回错误数据时的解决方案。

什么是 GraphQL 响应错误

GraphQL API 可以返回两种类型的结果：数据或错误。当 GraphQL API 返回数据时，响应将包含一个 data 字段，其中包含查询返回的数据。然而，当 GraphQL API 返回错误时，响应将包含一个 errors 字段，其中包含有关错误的详细信息。

GraphQL 响应错误信息结构

一个 GraphQL 响应可以同时包含数据和错误。以下是 GraphQL 响应错误的结构：

-- -------------------- ---- -------
-
  ------- - --- --
  --------- -
    -
      ---------- ------
      ------------ - --- --
      ------- - --- --
      ------------- - --- -
    --
    ---
  -
-

这个结构中 data 字段是正常响应中代表数据的字段。errors 是响应中可能存在的错误数组，每个错误对象按如下顺序包含以下属性:

message(String): 一个描述错误的字符串。
locations（[ { line, column } ]）: 一个描述错误所发生位置的数组。
path ([ String ]): 如果错误发生在查询的特定字段/统计的计算字段中，则 path 将是一个表示这些字段/统计的字段的字符串数组。
extensions(Object): 一个包含任意数量的信息的可选字段。这些便于客户端或工具使用可扩展的错误信息。

GraphQL 请求失败

GraphQL 返回错误数据时，如果发生类似于 500 错误之类的错误，请求会失败。如果请求失败，将不会获得任何响应对象。

解决 GraphQL 请求的错误响应

当您的 GraphQL API 返回错误时，您可能需要对这些错误进行故障排除，而不是让它们在客户端代码中引起异常或运行时错误。以下是一些常见的错误解决方案。

1. 在客户端处理 GraphQL 错误

您的客户端代码可以检查返回的响应并查看其中是否有错误,如果发现错误，您的客户端代码应该采取适当的措施（例如，提供有意义的错误消息并重试查询）。下面是一个使用 apollo-client 获取 GraphQL 数据的示例代码，它报告了任何 GraphQL 响应中的错误:

-- -------------------- ---- -------
------ - ------------- --------- ------------- - ---- ----------------------
------ - ------- - ---- ----------------------------

----- -------- - --- ---------- ---- ------------------------------------- ---

----- --------- - ---------- -------------- ------------ -- -- -
  -- --------------- -
    ------------------------ -------- ---------- ---- -- --
      --------------------- ------- -------- ----------- --------- ------------- ----- ---------
    --
  -

  -- -------------- --------------------- ------- ------------------
---

----- ------ - --- --------------
  ----- ---------------------------
  ------ --- ----------------
---

2. 同时使用错误和数据响应

GraphQL 响应包含可能具有错误和数据的 errors 和 data 属性，因此客户端代码需要检查两种情况。一种良好的做法是将错误和数据在客户端代码中分开处理。以下是一个示例客户端代码，使用了 apollo-client 处理 GraphQL API 的响应错误:

-- -------------------- ---- -------
------ - ------------- --------- ------------- - ---- ----------------------

----- -------- - --- ---------- ---- ------------------------------------- ---

----- ------ - --- --------------
  ----- ---------
  ------ --- ----------------
---

-------------- ------ ---------- ------------------ -- -
  -- ----------------- -
    -----------------------------
  - ---- -
    ---------------------------
  -
---

3. 处理特定错误

GraphQL API 返回的错误可能包含有关发生了什么、为什么发生以及如何处理它的更多信息。因此，您的客户端代码可以针对特定错误采取特定的操作。以下是一个示例客户端代码，在查询数据时处理特定的 GraphQL 错误:

client.query({ query: SOME_QUERY }).then((response) => {
  if (response.errors && response.errors[0].message === 'Unauthorized') {
    console.log('Unauthorized');
  } else {
    console.log(response.data);
  }
});

4. 在后端处理 GraphQL 响应错误

在某些情况下，可能需要在 GraphQL API 的后端代码中处理响应错误。例如，如果没有明确定义和处理 GraphQL API 的错误，您可能会收到不可预测的结果或不可预见的行为。下面是一个示例从 Node.js 后端处理 GraphQL API 响应错误的代码:

-- -------------------- ---- -------
------------------- ----------------- ---- -------------- -- -
  ----- ------ - --- -- ------ - ------- ------
  ----- --------- - --- -- ------ - ---- -----
  ----- ------------ - --- -- ---------- - ------- -----

  ------ --------------- --------------------- ---------- ----------------------------- -- -
    -- ----------------- -
      -----------------------------
      ----- --- -------------- -------- -------- ---------
    -

    ------ ---------
  ---
----

结论

当使用 GraphQL 作为前端开发工具时，可能会遇到 GraphQL API 返回错误数据的情况。本文讨论了处理 GraphQL 响应错误的方法以及如何在客户端和后端代码中处理它们。我们希望这篇文章对您在前端开发中使用 GraphQL 时遇到的错误和问题会有所帮助。

参考链接

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/674ab25da1ce0063549f2b39