首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

使用Apollo重构查询的Graphql,返回的对象是重复的( diff查询中的相同字段)

问题描述: 使用Apollo重构查询的Graphql,返回的对象是重复的( diff查询中的相同字段)

回答: 在使用Apollo进行Graphql查询时,有时可能会出现返回对象重复的问题。这通常是由于在查询中重复指定了相同的字段所导致的。重复的字段会导致相同的数据在返回结果中出现多次。

为了解决这个问题,我们可以采取以下几种方法:

  1. 去重查询字段:可以通过手动去重查询字段来解决。在GraphQL查询语句中,我们可以使用别名来指定不同的字段名称,从而避免重复。例如,如果我们查询"user"字段两次,可以使用别名来区分它们:
代码语言:txt
复制
query {
  user1: user {
    id
    name
  }
  user2: user {
    id
    age
  }
}

在这个例子中,我们使用了别名"user1"和"user2"来区分两个"user"字段。这样返回结果中就不会出现重复的对象了。

  1. 使用Fragments:可以使用GraphQL的Fragments来定义可重用的字段集合,并在查询中引用它们。这样可以避免在查询中多次重复指定相同的字段。例如:
代码语言:txt
复制
fragment UserFields on User {
  id
  name
  age
}

query {
  user1: user {
    ...UserFields
  }
  user2: user {
    ...UserFields
  }
}

在这个例子中,我们使用了名为"UserFields"的Fragment来定义"user"字段的字段集合。然后在查询中使用"..."语法引用该Fragment。这样就可以避免重复指定相同的字段了。

  1. 使用Apollo的缓存机制:Apollo有一个强大的缓存机制,可以在发送查询之前检查缓存并返回缓存中已存在的数据。这样可以避免重复查询相同的字段。可以通过配置Apollo Client的缓存策略来实现。详情请参考腾讯云产品Apollo Client的文档:Apollo Client 缓存

总结: 在使用Apollo重构查询的Graphql时,返回对象重复通常是由于在查询中重复指定了相同的字段所导致的。我们可以通过去重查询字段、使用Fragments和配置Apollo的缓存机制来解决这个问题。以上是一些建议,希望能帮到您。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

mysql过滤表中重复数据,查询表中相同数据的最新一条数据

先查询表几条demo数据,名字相同,时间不同 select id,name,create_date from sys_user 20181123171951945.png 方法1:最简单,且字段全部相同...,排除其他字段不同; 先对表按照时间desc排序,在查询该层使用group by 语句,它会按照分组将你排过序的数据的第一条取出来 select id,name,create_date from...( select * from sys_user order by create_date desc) a group by a.name 方法2:使用not exists,该方法通过相同名字的不同创建的时间进行比较...not exists (select * from sys_user b where a.name = b.name and a.create_date < create_date ) 方法3:使用内关联的方式...select * from sys_user a inner join ( -- 先查询出最后一条数据的时间 select id,name, MAX(create_date

5.5K40
  • 面对极度复杂的前后端业务场景,使用 GraphQL 正确的姿势

    GraphQL中可以由前端来定义Query,页面和数据能完美匹配。同时一旦Schema确定,前后端就可以快速并行开发。前端对字段及返回类型也能够了如指掌,GUI清晰的展现了字段的类型结构。...在使用Apollo的过程中我们也遇到了一些坑。...还有资源对象和id重复导致资源数据被覆盖的问题,这是由Apollo的数据存储的特性所造成的,Apollo的每个资源对象的类型和id是定义数据字段唯一的标识。...现在使用GraphQL之后,我们发现了一个更优的解决方案。 因为每个对象的资源字段固定,完全可以让每个Component和GraphQL 的Query片段一一对应。...一是接口开发工作量大幅减少,重复性工作得以减少,避免了出错。其次是错误返回和文档等标准化工作可以借助工具本身完成。最后是对API多版本管理更加友好。

    7.6K20

    干货 | 万字长文全面解析GraphQL,携程微服务背景下的前后端数据交互方案

    比如对字段的条件表达。假设有两次查询,它们唯一的差别就是,一个有 A 字段,另一个没有 A 字段,其它字段及其结构都是相同的。为了这么小的差别 ,前端难道要编写两个查询语句?...比如,字段 A 和字段 B,拥有相同的总体结构,仅仅只有 1 个字段名的差异。前端并不想编写一样的 key 值重复多次。 这意味着,我们需要设计一个片段语法(Fragment)。 ?...其中 Query 对象是数据消费的入口。所有查询,都是对 Query 对象下的字段的查询。可以把 Query 下的字段,理解为一个个 RESTful API。...因此,Apollo-GraphQL 里有很多功能对我们来说没必要,有一些功能的使用方式,跟我们的场景也不契合。...我们主要使用的是 Apollo-GraphQL 的 graphql-tools 和 apollo-server-koa 两个模块,并在此基础上,进行了符合我们场景的设计和改编。

    3.8K21

    GraphQL-BFF:微服务背景下的前后端数据交互方案

    比如对字段的条件表达。假设有两次查询,它们唯一的差别就是,一个有 A 字段,另一个没有 A 字段,其它字段及其结构都是相同的。为了这么小的差别 ,前端难道要编写两个查询语句?...比如,字段 A 和字段 B,拥有相同的总体结构,仅仅只有 1 个字段名的差异。前端并不想编写一样的 key 值重复多次。 这意味着,我们需要设计一个片段语法(Fragment)。 ?...其中 Query 对象是数据消费的入口。所有查询,都是对 Query 对象下的字段的查询。可以把 Query 下的字段,理解为一个个 RESTful API。...之前有多少 RESTful 服务,重构后就有多少 GraphQL 服务。它是一个简单的一对一关系。 默认情况下,面向两个 GraphQL 服务发起的查询是两次请求,而不是一次。...我们主要使用的是 Apollo-GraphQL 的 graphql-tools 和 apollo-server-koa 两个模块,并在此基础上,进行了符合我们场景的设计和改编。

    3.8K72

    GraphQL-BFF:微服务背景下的前后端数据交互方案

    比如对字段的条件表达。假设有两次查询,它们唯一的差别就是,一个有 A 字段,另一个没有 A 字段,其它字段及其结构都是相同的。为了这么小的差别 ,前端难道要编写两个查询语句?...比如,字段 A 和字段 B,拥有相同的总体结构,仅仅只有 1 个字段名的差异。前端并不想编写一样的 key 值重复多次。 这意味着,我们需要设计一个片段语法(Fragment)。 ?...其中 Query 对象是数据消费的入口。所有查询,都是对 Query 对象下的字段的查询。可以把 Query 下的字段,理解为一个个 RESTful API。...之前有多少 RESTful 服务,重构后就有多少 GraphQL 服务。它是一个简单的一对一关系。 默认情况下,面向两个 GraphQL 服务发起的查询是两次请求,而不是一次。...我们主要使用的是 Apollo-GraphQL 的 graphql-tools 和 apollo-server-koa 两个模块,并在此基础上,进行了符合我们场景的设计和改编。

    1.6K20

    GraphQL 基础实践

    如果我们的某个字段返回不止一个标量类型的数据,而是一组,则需要使用List类型声明,在该标量类型两边使用中括号[]包围即可,与 JavaScript 中数组的写法相同,而且返回的数据也将会是数组类型。...在数据返回前查出两个 key 为 movie 的数据,合并之后由于 key 重复而只能拿到一条数据。那么在这种情况下我们需要使用别名功能。...别名即为返回字段使用另一个名字,使用方法也很简单,只需要在请求体的字段前面使用别名:的形式即可,返回的数据将会自动替换为该名称。 ?...在本例中,定义了一个Basic接口,Song以及Video类型都要实现该接口的字段。然后在search查询中返回该接口。 searchMedia查询返回一组Basic接口。...Resolver 对应着 Schema 上的字段,当请求体查询某个字段时,对应的 Resolver 函数会被执行,由 Resolver 函数负责到数据库中取得数据并返回,最终将请求体中指定的字段返回。

    12.8K20

    记一次通过c#运用GraphQL调用Github api

    一、Graphql是什么   最近在折腾使用Github api做个微信小程序练练手,本篇文章就是在这个过程中记录。   ...GraphQL 既是一种用于 API 的查询语言也是一个满足你数据查询的运行时。...GraphQL 对你的 API 中的数据提供了一套易于理解的完整描述,使得客户端能够准确地获得它需要的数据,而且没有任何冗余,也让 API 更容易地随着时间推移而演进,还能用于构建强大的开发者工具。...第一个是edge与node的概念,edge可以理解为一个分页对象,其中除了包含实际的数据外还有一个cursor(返回的每条数据的唯一标识,如果要分页的话用得到这个数据,配合before与after关键字来使用...另外GraphQL是强类型的,所以当笔者用到的search返回的结果并不是一个明确的数据对象时,先需要通过node下的__typename字段来获得实际的对象是什么。

    1.3K20

    GraphQL在现代Web应用中的应用与优势

    前端设置(使用Apollo Client)接着,我们需要在前端应用中配置Apollo Client,与我们的GraphQL服务器通信:npm install apollo-boost @apollo/client...查询语言:查询、突变、订阅在GraphQL中,查询和突变是通过JSON-like结构表示的字符串。...查询结构:字段和参数查询结构由字段和参数组成。在上面的查询示例中,user是字段,id和email是user字段的子字段。参数如id: 1用于定制查询。4....这就是GraphQL查询、类型系统和层次结构在实际应用中的体现。...下面展示如何使用一个自定义的@auth指令来控制访问权限。首先,假设我们定义了一个@auth指令,用于限制对某些字段的访问,要求用户必须登录。

    10710

    GraphQL+Koa2实现服务端API结合Apollo+Vue

    GraphQL 对你的 API 中的数据提供了一套易于理解的完整描述,使得客户端能够准确地获得它需要的数据,而且 没有任何冗余。...比如:字段冗余,扩展性差、无法聚合 api、无法 定义数据类型、网络请求次数多 GraphQL 的出现整好弥补了 RESTful APi 的不足 使用 GraphQL 的公司 目前已经有很多的公司在使用...前端对于真正用到的字段是没有直观映像的,仅仅通过 url 地址,无法预测也无 法回忆返回的字段数目和字段是否有效,接口返回 50 个字段,但却只用 5 个字段,造 成字段冗余,扩展性差,单个 RESTful...再次查询列表 修改 删除 五、Vue中使用GraphQl 5.1 使用graphQl简单查询 安装 找到Vue中集成GraphQl的文档 https://github.com/vuejs/apollo...:h=>h(App) }) 简单查询 组件加载的时候就会去服务器请求数据,请求的数据会放在navList这个属性上面,在模板中可以直接使用当前属性 简单查询文档 带参数查询参考 import gql from'graphql-tag

    5.2K42

    怎样使用 apollo-link-state 管理本地数据

    那么剩下的 20% 的本地数据(例如全局标志、设备 API 返回的结果等)应该怎样处理呢? 过去,Apollo 的用户通常会使用一个单独的 Redux/Mobx store 来管理这部分本地的数据。...要实现一个理想的状态管理方案,我们应当对 Redux 取长弃短。此外,GraphQL 有能力将对多个数据源的请求集成在单次查询中,在此我们将充分利用这个特性。 ....Apollo Link 使得在 Apollo Client 中管理本地的数据成为可能,从一个 GraphQL 服务器中获取数据,可以使用 HttpLink,而从 Apollo 的缓存中请求数据,则需要使用一个新的...在下面的例子中,我们在同一条 query 内查询了 GraphQL 服务器中存储的 user 数据以及 Apollo cache 中的 visibilityFilter 数据。 ....以上代码使用 @client 指令查询 Apollo cache。 在我们 最新的文档页中,可以找到更多的例子,以及一些将 apollo-link-state 集成在应用中的小贴士。

    2.4K100

    GraphQL到底怎么使?看看智联前端团队技术沉淀

    ,所以如 query、mutation、subscription 字段是不会出现在返回结果中的,返回结果中的第一层字段是前文提到的 root field(根字段)。...执行字段: 确定了选择集的执行顺序后开始真正的字段值的获取,非常简化的讲,Schema 中的类型应该对其每个字段提供一个叫做 Resolver 的解析函数用于获取字段的值。...使用 Fragments(片段)降低 Document 的复杂度。 使用 Field Alias(字段别名)进行简单的返回结果字段重命名。 这些都没有什么问题。...在 Apollo 实现的 Graphql 生态中则是支持自定义 Schema 端可用的指令,对 Document 端的自定义指令实现暂不支持且不建议支持。...版本控制:客户端结构化的查询方式可以让服务追踪到字段的使用情况。且在增加字段时,根据结构化查询按需查询的特点,不会影响旧的调用(虽然 JavaScript 对多了个字段的事情不在意)。

    2.3K20

    《GraphQL 名词 101:解析 GraphQL 的查询语法》【译】

    请注意,它们始终称为“字段”,无论它们所在的层次有多深。在你的查询中,对根节点字段的处理和最底层字段应该是一样的。 参数(Arguments):一组与特定字段关联的键值对。...这样,无论你是在网络日志中或者GraphQL服务器上发现错误,你都可以通过名字很轻松的在代码库中定位问题,而不是靠猜测(类似的工具有 Apollo Optics)。...变量使用特定的序列化协议(在目前的 GraphQL 服务实现中,通常是使用JSON )通过查询文档独立传输。...GraphQL查询必须包含一个标识选择集的字段,且该字段返回的是对象类型,选择集不能设置在返回值是标量类型(Scalar Types)的字段上,例如Int或者String。...片段是 GraphQL 的主要组合数据结构,通过片段可以重用重复的字段选择,减少 query 中的重复内容。

    3K20

    解读GraphQL|洞见

    3.2 在现代场景中难于维护 虽然REST的目标是易于维护和扩展,但在Web前端/客户端领域,它的表现并没有想象得那么好。我们经常说最明显的Code smell就是重复。...你也可以加上其他字段,或者删掉字段试试看结果会怎样。 GraphQL用来构建客户端API,但它并不关心视图,也不关心服务的到底是什么客户端。...如果不使用某些限制过大的查询,反复请求一条Load出所有Github用户的查询可能会让他们的服务器直接挂掉,GraphQL提高了被DDoS的风险。...因此在使用GraphQL的过程中,我们要对安全问题更加重视。 3.需要重新思考Cache策略 REST虽然会引起一些性能问题,但它也以HTTP Cache的方式解决了很多性能问题。...(图片来自:http://t.cn/R6qcOfq) 我们将会从Apollo开始,感受GraphQL究竟是如何工作的,之后我们也会看到这个方案中的一些问题,而这些问题会将我们引向更深层的Web客户端问题

    1.1K70

    TypeGraphQL的尝试

    前言 GraphQL 在我们之前的项目中的使用情况非常不错,后端可以只需要专注于合理的 Schema 设计与开发,并不需要太关心界面上的功能交互,在前端我们用 Apollo GraphQL 替代了 Redux...@Resolver:来声明当前类是数据处理的 @Query:声明改方法是一个 Query 查询操作 @Mutation:声明改方法是一个 Mutation 修改操作 @FieldResovler:对 @...Resolver(of => Recipe) 返回的对象添加一个字段处理 方法参数: @Root:获取当前查询对象 @Ctx:获取当前上下文,这里可以拿到 egg 的 Context (见上面中间件集成中的处理...如果校验不通过,则会返回 null 或者报错,取决于当前字段或者操作是否支持 nullable。...我们在正式使用中目前也没有遇到大的问题,该项目目前也比较活跃,很多新的特性也在开发中,建议可以做一些尝试。

    2.3K10

    GraphQL 从入门到实践

    传统的 API 拿到的是前后端约定好的数据格式,GraphQL 对 API 中的数据提供了一套易于理解的完整描述,客户端能够准确地获得它需要的数据,没有任何冗余,也让 API 更容易地随着时间推移而演进...args:查询中传入的参数 context:提供给所有解析器的上下文信息 info:一个保存与当前查询相关的字段特定信息以及 schema 详细信息的值 解析函数的返回值可以是一个具体的值,也可以是...一些常用的解决方案如 Apollo 可以帮省略一些简单的解析函数,比如一个字段没有提供对应的解析函数时,会从上层返回对象中读取和返回与这个字段同名的属性。...;另一个查询入口 user 接受一个字符串,查找 ID 为这个字符串的用户,并返回一个 User 类型的可空字段 # src/schema.graphql # Query 入口 type Query...据一位在 Twitter 工作的大佬说硅谷不少一线二线的公司都在想办法转到 GraphQL 上,但是同时也说了 GraphQL 还需要时间发展,因为将它使用到生产环境需要前后端大量的重构,这无疑需要高层的推动和决心

    2.5K31

    【译】Graphql, gRPC和端对端类型检验

    最终我们选择了Apollo GraphQL+gRPC+React+TypeScript这样一套技术栈,并对使用它们的结果感到满意。...只需要在我们的schema中增加查询(queries)和变更(mutations)字段,就可以在应用中使用(consuming)这些数据了。...使用apollo-client和react-apollo简化了前端代码对缓存和数据的管理。 灵活的查询方式方便我们在未来构建移动端以及内部应用。...为了保证GraphQL server和前端之间的类型安全,我们使用Apollo CLI的代码生成器:使用命令行来生成我们所有GraphQL查询的类型: React示例 在我们的应用中需要用到三种查询:...CreateTodoVariables是GraphQL mutation的入参字段类型,CreateTodoType是GraphQL mutation操作的返回字段类型。

    3.1K20

    GraphQL 入门详解

    简介 定义 一种用于API调用的数据查询语言 核心思想 传统的api调用一般获取到的是后端组装好的一个完整对象,而前端可能只需要用其中的某些字段,大部分数据的查询和传输工作都浪费了。...服务,用于处理graphql的查询请求,它接收一个options参数,其中schema是一个 GraphQLSchema实例,我们接下来定义,graphiql设置为true可以在浏览器中直接对graphQL...注意字段的数据类型需要使用GraphQL定义的,不能使用js中的基本数据类型。...我们需要定义一个root query,root query做为所有查询的入口,处理并返回数据,更多请参考 GraphQL Root fields & resolvers。...react-apollo 是react视图层的集成,graphql 用于解析graphql的查询语句。

    2.1K20
    领券