GraphQL 是一个由 Facebook 开发的开源数据查询和操作语言，它让客户端能够精确地获取需求的数据，而非一次性获取所有数据。在 GraphQL 中，客户端需要通过一个特定的查询语言来获取数据。而 graphql-depth-limit npm 包，可以用来限制 GraphQL 查询的深度，避免数据的过度获取。
安装
npm install graphql-depth-limit
使用
-- -------------------- ---- ------- ----- ---------- - ------------------------------- ----- ------- - ------------------- ----- - ----------- - - --------------------------- ----- ------ - -------------------- ----- --- - ---------- ------------------- ------------- ------- ---------------- ---------------- -- ------- - --------- ----- ---- ---------------- -- -- - ---------------------- ---
以上示例代码加载了 graphql-depth-limit npm 包，使用了 Express 和 graphqlHTTP 中间件来生成 GraphQL API，并使用了 validationRules 来添加 depthLimit 校验规则。
查询深度
GraphQL 操作可以包含多个嵌套字段查询，每个字段可能又包含多个嵌套查询。这样的多级嵌套查询会导致深度不断加深，使得查询的结果过度庞大，甚至超出了自身的处理范围。
使用 graphql-depth-limit npm 包，可以防止查询的深度过多，避免数据的过度获取。
参数
graphql-depth-limit 对象包含一个参数 depthLimit，它决定了 GraphQL 查询的最大深度。当查询的深度大于 depthLimit 时，graphql-validation-complexity 将自动中止查询操作，并抛出一条错误消息。
depthLimit(limit: number)
示例
以下是一个使用 graphql-depth-limit 的示例：
-- -------------------- ---- -------
----- -
-------- -- -
--
----
------- -
--
----
----- -
--
-----
------ -
--
----
------- -
--
----
----- -
--
-----
-
-
-
-
-
-
-在上述示例中，用户通过一个 user 查询来获取 id、name 和 friends 信息，friends 中包含 id、name 和 posts 信息。posts 中包含 id、title 和 author 信息，而 author 信息里又包含了 id、name 和 friends 信息。
当 depthLimit（查询深度）为 3 时，查询结果只能返回三层级别，所以结果将如下所示：
-- -------------------- ---- -------
-
------- -
------- -
----- ----
------- -------
---------- -
-
----- ----
------- -------
-------- -
-
----- ----
-------- -------- ----- -------
--------- -
----- ----
------- -------
---------- -
-
----- ----
------- -------
-------- ----
-
-
-
-
-
-
-
-
-
-由于查询深度已经到达了 3，因此结果中只返回了三层级别的信息，而 author 的 friends 和 posts 信息被截断了。
结论
graphql-depth-limit npm 包可以帮助您有效地限制 GraphQL 查询的深度，避免数据的过度获取，让查询结果更加精确、高效和可靠。通过上述的教程和示例，您可以更好地理解 graphql-depth-limit 包的使用和意义，它有助于提高前端工程师的技能水平，让您的应用程序更加健壮、可靠，赋予更好的用户体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055fa981e8991b448dcfb5