使用 Apollo 来处理 GraphQL 异常和错误

GraphQL 是一种强类型的查询语言,它为前端工程师提供了一种简单优雅的方式来检索和修改数据。而 Apollo 是一个流行的 GraphQL 客户端,在 JavaScript 生态系统中使用广泛。

在实践中,GraphQL 查询可能会遇到各种错误和异常,如查询不存在的字段或使用错误的参数等等。在本文中,我们将探讨如何使用 Apollo 处理 GraphQL 异常和错误,以保证我们的应用程序不会因为意外情况而崩溃。

确认异常

当使用 Apollo 查询 GraphQL API 时,一个常见的问题是查询返回错误或异常。为了捕获这些异常,我们可以使用 onError API 来设置一个全局的错误处理程序,如下所示:

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

当查询失败时,onError 处理程序将被调用,并传递错误对象。我们可以通过检查错误对象来确认异常的类型,并执行相应的操作,如显示错误消息或重试查询。

影响缓存

另一个容易忽略的问题是 GraphQL 查询失败对缓存的影响。如果我们在查询错误时不进行处理,可能会导致缓存中包含错误的数据,影响我们的应用程序的正确性。

为了解决这个问题,Apollo 提供了一个名为 update 的 API,允许我们手动更新缓存。例如,可以在 onError 处理程序中重置与查询相关的缓存:

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

这里我们使用 resetStore 方法重置缓存,使其处于干净状态。这种方式可以确保我们的应用程序不会因为缓存中包含错误的数据而出现不良效果。

重试查询

有时,GraphQL 查询可能由于连接错误或过多的查询等原因失败。在这种情况下,我们可以尝试重新发出查询,并处理可能失败的情况。

Apollo 提供了一个名为 refetch 的 API,允许我们重新发出一个查询并获取新的数据。我们可以将 refetch API 与 onError 处理程序结合使用,在查询错误时尝试多次查询:

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

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

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

这里我们使用 refetch API 来重新发出查询并获取新的数据。在查询出现异常时,我们尝试多次重新查询,直到获得正确的结果。在成功后,我们更新 UI 并将新的数据呈现给用户。

结论

Apollo 提供了很多有用的 API 来处理 GraphQL 异常和错误。通过设置全局错误处理程序、更新缓存和重试查询,我们可以减少应用程序的故障率,并提供更好的用户体验。

最重要的是,我们需要确定应用程序中出现的异常类型,并执行相应的操作,以避免这些异常对应用程序的功能和性能产生负面影响。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/673484da0bc820c582499cff