首页
学习
活动
专区
圈层
工具
发布

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

那么剩下的 20% 的本地数据(例如全局标志、设备 API 返回的结果等)应该怎样处理呢? 过去,Apollo 的用户通常会使用一个单独的 Redux/Mobx store 来管理这部分本地的数据。...此外,GraphQL 有能力将对多个数据源的请求集成在单次查询中,在此我们将充分利用这个特性。 . 以上是 Apollo Client 的数据流架构图。...Apollo Link 使得在 Apollo Client 中管理本地的数据成为可能,从一个 GraphQL 服务器中获取数据,可以使用 HttpLink,而从 Apollo 的缓存中请求数据,则需要使用一个新的...Resolvers 在使用 Apollo Client 管理应用状态后,Apollo cache 成为了应用的单一数据源,包括了本地和远端的数据。那么我们应当如何查询和更新缓存中的数据呢?...apollo-link-state 支持异步的 resolver 方法,可以用于执行一些异步的副作用过程,比如访问一些设备的 API。然而,我们不建议在 resolver 中对 REST 端点发请求。

3K100

GraphQL最突出的架构优势是什么?

作者 | Khalil Stemmler 策划 | 田晓旭 在服务器上使用 GraphQL 代替 REST 是有很多好处的,使用 Apollo Client 取代自己编写的数据获取逻辑也有很多优势。...简化的数据获取架构,其中视图可以是任意前端框架——nerdwallet 数据图在连接的两端均有 Apollo 服务器和客户端,它可以简化获取逻辑、错误逻辑、重试逻辑、分页、缓存、optimistic UI...在 Apollo Server 端,这些 API 调用将控制权转交给负责使用 ORM、原始 SQL、缓存、其他 RESTfulAPI 或任何你想到的方法来获取数据的解析器。...API 客户端了解如何解决该请求的唯一方法是检查错误响应(指望错误消息描述了所需的信息,否则也没用)。...前端开发人员可以使用数据图来创建自己的数据获取用例,而不必依赖后端开发人员。 GraphQL 消除了管理 API 版本的需要,Apollo 的 GraphManager 可以简化生产模式验证。

3K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    2023 React 生态系统,以及我的一些吐槽……

    (可能是编程中最难的事情之一) 将多个请求相同数据的重复请求合并为单个请求 在后台更新“过时”的数据 了解数据何时“过时” 尽快反映数据的更新 性能优化,如分页和惰性加载数据 管理服务器状态的内存和垃圾回收...RTK Query 从先驱解决数据获取问题的其他工具(如 Apollo Client、React Query、Urql 和 SWR)中获得灵感,但在其 API 设计中增加了独特的方法: 数据获取和缓存逻辑是构建在...UI 层一起使用 API 端点是预先定义的,包括如何从参数生成查询参数和将响应转换为缓存的方式 RTK Query 还可以生成封装整个数据获取过程的 React hooks,为组件提供数据和 isLoading...这复杂的 API 风格,欣赏不来。 Apollo Client Apollo Client 是一个全面的 JavaScript 状态管理库,可让您使用 GraphQL 来管理本地和远程数据。...使用它来获取、缓存和修改应用程序数据,同时自动更新用户界面。 Apollo Client 帮助您以经济、可预测和声明式的方式组织代码,与现代开发实践一致。

    3.6K30

    用ServBay快速构建下一代GraphQL应用

    GraphQL是由Facebook开发的一种数据查询和操作语言,用于API,并作为运行时用于执行这些查询的服务器端软件的一种方式。它提供了一种更高效、强大和灵活的替代REST的方法。...主要功能包括声明式数据获取:使用 GraphQL,客户端可以在查询中精确指定所需的数据,包括字段和关系。这消除了传统 REST API 经常出现的数据过度获取和获取不足的问题。...高效的类型系统: GraphQL 拥有强大的类型系统,可以在 API 中定义数据的结构和关系。高效的数据加载功能: GraphQL 使客户端能够在单个请求中检索多个资源。...下一步是配置数据源,即PostgreSQL数据库。我们将利用现有的 PostgreSQL 数据库应用程序映像,而不是在本地安装和配置它,该映像将在单独的 Docker 容器上运行。...为此,只需导航到 即可在浏览器中访问 Apollo Server API 沙箱http://localhost:/graphql。进入沙箱后,您可以发送请求并观察响应。

    1.7K00

    你还在用 REST API 吗?

    REST(Representational state transfer,表述性状态转移) 是一种 API 设计架构,用于通过使用一组预定义的无状态操作(包括 GET、POST、PUT 和 DELETE...灵活性 是使用 REST 的另一个优势,因为可以将其设计成处理不同类型的调用并返回不同的数据格式。 REST 的劣势 抓取过度——这是指 API 端点提供的信息比客户端所需要的要多得多。...抓取不足——这是指 API 端点并没有提供所需的全部信息。因此,客户端必须发出多个请求才能获取应用程序所需的全部内容。 什么是 GraphQL?...如果使用 REST,我们至少要发出 2 到 3 个请求,类似于: /user/以获得用户(作者)的详细信息,比如名称。 /user//posts 获取该用户发布的帖子列表。...但是,当使用 Apollo Client、Relay 等客户端时,它也能很容易处理错误。 结 论 与 REST 相比, GraphQL 当然更具优势,但它可能并不总是最佳实践。

    1.9K10

    GraphQL是API的未来,但它并非银弹

    1 REST 的缺点 作者指出了 REST API 的一系列缺点,以及 GraphQL 如何克服所有这些缺点: 过度获取; 多个请求请求多项资源; 针对嵌套数据的瀑布式网络请求; 每个客户端都需要知道每个服务的位置...你可以将多个调用封装到一个 API 中,让它们在服务器端完成,而不是从客户端发出多个请求。此方法也可以解决过取和欠取问题,因为你可以在将数据发回客户端之前对其进行操作。...8 错误处理更好 关于错误处理,作者描述了这样一个场景:与使用部分数据响应的单个 GraphQL 查询相比,客户端将不得不进行 3 次连续的 REST API 调用。...使用 GraphQL,解析部分数据的逻辑位于服务器中。客户端需要有额外的逻辑对部分响应做相应的处理。 使用 REST,获取部分数据的逻辑位于客户端或 BFF 中。...对于所描述的用例,REST API 将变得边缘化,这并不是因为 GraphQL 更好。是工具和生态系统将使 GraphQL 的市场份额继续增加。

    2.6K10

    REST API和GraphQL API的比较

    REST API REST(表述性状态传输)API 是一种应用程序接口 (API) 的架构风格,它使用 HTTP 请求来访问和使用数据。...GraphQL 采用了一种直接的方法并且不对 API 进行版本控制。 表现 开发人员只需一次 API 请求即可使用 GraphQL 获取数据。...为了避免数据获取不足和过度获取,灵活的样式定义了信息请求的结构,并从服务器返回相同的结构。 与 GraphQL 相比,REST API 具有严格的数据结构,可能首先返回不相关的信息(过度获取)。...但是,由于可用的工具,客户端缓存优于 REST。一些使用缓存层的客户端(Apollo Client,URQL)使用 GraphQL 的模式和类型系统,允许它们在客户端保留缓存。...错误处理 每个 GraphQL 请求、成功或错误都会返回 200 状态代码。与 REST API 相比,这是一个明显的区别,在 REST API 中,每个 状态代码都指向某种类型的响应。

    1.8K10

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

    它弥补了 RESTful API(字段冗余,扩展性差、无法聚合 api、无法定义数据 类型、网络请求次数多)等不足 注意:GraphQL 是 api 的查询语言,而不是数据库。...从这个意义上说,它是数据库无关的, 而且可以在使用 API 的任何环境中有效使用,我们可以理解为 GraphQL 是基于 API 之上的一 层封装,目的是为了更好,更灵活的适用于业务的需求变化 GraphQL...比如:字段冗余,扩展性差、无法聚合 api、无法 定义数据类型、网络请求次数多 GraphQL 的出现整好弥补了 RESTful APi 的不足 使用 GraphQL 的公司 目前已经有很多的公司在使用...接口返回数据越来越臃肿 API 聚合问题,某个前端展现,实际需要调用多个独立的 RESTful API 才能获 取到足够的数据,导致网络请求次数多 前后端字段频繁改动,导致类型不一致,错误的数据类型可能会导致网站出错...(fetch)的只读请求 mutation:获取数据后还有写操作的请求 新版本的GraphQL还支持subscription,这是为了处理订阅更新这种比较复杂的实时数据更新场景而设计的操作 三、Express

    6.1K42

    REST API 还是 GraphQL?

    前言 说到 API 设计,GraphQL 和 RESTful API 是当前最主流的两种选择,各自有其独特优势与挑战。...正文 GraphQL 优劣势 GraphQL 是 Facebook 推出的声明式查询语言,它的最大优势在于灵活和高效。 你只需要请求自己需要的字段,减少冗余数据传输,可以很大程度上优化性能。...当然,它的劣势也很明显: 不像 REST 可以使用 HTTP 缓存,GraphQL 的缓存需要借助 Apollo 等第三方库维护!...RESTful API 优劣势 RESTful API 是目前最广泛使用的接口规范,基于 HTTP 协议,使用资源路径和请求方法组合完成数据操作。...而且通过 Postman、curl 等工具即可快速测试和验证接口。 但它也存在一些问题: 比如,请求冗余,无法控制字段粒度,常常返回大量用不到的数据!

    46910

    为什么我使用 GraphQL 而放弃 REST API?

    至此,我再也无法回过头来享受使用 REST 的工作了。 REST 有什么问题吗? 每个 REST API 都是独特的 公平地说,REST 甚至不是一个标准。...没有静态类型意味着要注意类型验证 无论如何努力避免这种情况,你迟早会遇到 JSON 属性拼写错误、发送或接收的数据类型错误、字段丢失等问题。...如果应用程序需要项目有所有者,并且除了每个集合有单独的视图显示外,还有一个视图显示所有这些数据的聚合?它要么是三个独立的 HTTP 请求,要么是一个复杂的请求,同时获取所有数据用于聚合。...你需要同时在服务器和客户端上实现每个端点 还有大量的库可以在 ORM 或直接数据库自省的帮助下自动生成 REST 端点。即使使用了这样的库,它们通常也不是很灵活或可扩展的。...要了解这些工具是如何工作的,请查看 Star Wars API 示例,它可以作为 GraphiQL 的在线演示。 能指定从服务器请求的对象字段让客户端可以根据需要只获取需要的数据。

    3.3K30

    GraphQL:如何构建灵活的数据 API,让前后端握手言和?

    REST API 虽然经典,但数据结构固定,往往造成前端拿到了一大堆自己不需要的数据,或者缺少一些关键信息,不得不再请求一次,白白增加了网络开销。...这意味着前端可以在一个请求中获取所有需要的数据,而不必额外请求多个端点。...让我们从零开始,搭建一个简洁的 GraphQL API,后端使用 Node.js 和 Apollo Server,数据库使用 SQLite。1....Comment 只有 id 和 text。Query 是 GraphQL API 的入口点,可以获取 user 和 posts 数据。3....相比 REST,它让前端拥有了更大的自由度,避免了 “拿到一大堆没用数据” 和 “不得不发多个请求” 的问题。同时,它还支持实时订阅、数据合并等高级特性,让 API 更加智能。

    43010

    GraphQL与传统API对比介绍教程

    优点:简单直观:使用HTTP协议,易于理解和实现。广泛支持:几乎所有的编程语言和框架都支持REST。标准化:遵循统一的资源标识和操作方式。...缺点:冗余数据:每次请求通常会返回整个资源对象,可能包含大量不需要的数据。多个请求:获取相关联的数据(如嵌套资源)可能需要多次请求,增加了网络开销。...性能问题:复杂的查询可能导致性能问题,需谨慎设计和优化。详细对比数据获取方式REST:每个URL代表一个资源,客户端请求一个资源时,服务器返回整个资源对象。...性能REST:可能需要多次请求才能获取嵌套资源,增加了网络开销。GraphQL:可以在一次请求中获取所有相关数据,但复杂查询可能增加服务器负担。...REST简单直观,适合传统的CRUD操作和简单的API设计。而GraphQL提供了更高的灵活性和精确的数据获取能力,适合复杂的前端应用和需要减少网络请求的场景。

    73710

    使用 GraphQL 进行 API 设计:从入门到实战

    最初,我主要使用 RESTful API,但随着前端需求的日益复杂,REST 的一些局限性逐渐显现,比如数据过载(获取的字段太多)和数据不足(一次请求拿不到所需的数据)。...后来,我接触了 GraphQL,它的灵活性和高效性让我眼前一亮。今天,我就来和大家聊聊如何使用 GraphQL 进行 API 设计,并通过一个实际项目代码示例,让你轻松上手。什么是 GraphQL?...它的核心特点包括:灵活查询:客户端可以自定义返回的数据结构,避免无用数据。单一端点:所有请求都通过同一个 URL 处理,不需要多个 REST 端点。...设计 GraphQL API:一个简单的博客系统假设我们正在开发一个博客系统,其中包含用户(User)、文章(Post)和评论(Comment)。我们希望提供一个灵活的 API,允许前端按需获取数据。...搭建 GraphQL 服务器我们使用 Node.js 和 Apollo Server 实现一个简单的 GraphQL 服务器。

    85910

    用 GraphQL 查询你的 Django 应用

    相较于 Overfetching 是获取了过多数据,Underfetching 则是在请求获取的数据不足够满足需求。...传统的 REST 协议 假如我们需要获取所有用户维度的评论,我们需要先获取通过 /users 所有用户 id,再使用 id 列表遍历查询 /users//comments 来获取相关的列表。...", } ] } ] } 相较于自定义的 REST 协议,使用 GraphQL 可以更简单: 使用 GraphQL,只需要一次请求 ---- 相信通过上面的例子...简单来说,要想在原生 Javascript 中直接使用 GraphQL 并不是一件特别容易的事,需要一些库来协助拉取和管理 GraphQL 数据。...鉴权 由于 API 请求并不再经过传统封装的 ViewSet,原有的鉴权组件不再能使用,你需要引入新的 graphene-permissions 来解决针对用户的权限控制。

    2.9K60

    GraphQL-to-REST API Connectors是Apollo的“最伟大的成就”

    REST API 还具有 GraphQL 可能无法提供的功能。虽然两者都支持从后端系统获取数据,但它们解决的是不同的问题,并且从不同的角度处理数据。...也就是说,GraphQL 提供了一种强类型的架构定义语言来描述跨任意数量系统的数据,这种方式对客户端来说既直观又实用。相比之下,REST 鼓励采用更加面向资源的方法来组织和部署服务,通常沿着域边界。...部署一个新的子图服务,包括监控、自动扩展和负载均衡,它将位于路由器和 REST API 之间。 Anthony 描述了每次更改 REST API 时的情况: 必须设计底层 REST 数据的子图模式。...必须使用所选编程语言编写与 REST API 的绑定。 必须编写利用这些绑定的解析器。 必须部署子图服务。 必须组合和发布用于更新路由器的模式。...Anthony 描述了使用 Apollo Connectors 如何减少每次迭代: 设计底层 REST 数据的子图模式。

    66010

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

    这个项目涉及到整合不同的数据源,以及一些现有和全新的系统。...GraphQL 当听到我们需要在这个项目中“整合许多不同的数据源”时,我立即意识到使用GraphQL作为API网关会是一个不错的选择。...使用apollo-client和react-apollo简化了前端代码对缓存和数据的管理。 灵活的查询方式方便我们在未来构建移动端以及内部应用。...gRPC 一开始,我们本来打算使用REST API来集成我们的后端服务。然而我们的后端团队已经使用了gRPC来标准化后端服务之间的通信方式。...你可以在这里阅读到更多有关于gRPC的内容) 通过grpc-gateway我们依然可以选择使用REST API来暴露接口,但是我们依然想通过使用gRPC来探索它能给我们带来什么好处。

    3.6K20

    jpsite-v1环境搭建

    文档自动生成功能,提供丰富的API管理 支持一二级缓存,使得性能到达极致(一级缓存是由 ConcurrentHashMap ,二级缓存使用 redis ) session登录成功存储 redis 中,实现...REST接口开发规范 基于Spring boot构建,配置文件能少则少 基于Spring security 的权限验证 1....集成Spring Data Elastic方便使用ElasticSearch (后续开发)mybatis动态多数据源配置与分布式事务控制 (后续开发)动态渲染.docx合同文件协议模板,并生产pdf与快照...akomv15uh8.png] xxl-job本地docker安装 git clone https://github.com/xuxueli/xxl-job.git 修改配置文件 Spring Boot 属性配置和使用...配置数据库连接信息 编辑demo.sh,修改ApolloPortalDB和ApolloConfigDB相关的数据库连接串信息。

    87310

    2020 年你应该知道的 React 库

    当涉及到远程数据的状态管理时,如果远程数据带有 GraphQL 端点,我建议使用 Apollo Client。Apollo Client 的替代方案是 urql 和 Relay。...建议: Formik React Hook Form React 中的数据获取库 很快,您就必须向远程 API 发出请求,以便在 React 中获取数据。...现代浏览器带有本地获取 API 来执行异步数据请求: function App() { React.useEffect(() => { const result = fetch(my/api...但是,有时候不仅需要提供复杂的异步请求,还需要它们具有更强大的功能,而且只是一个轻量级的库。我推荐的这些库之一称为 axios。当您的应用程序增大时,可以使用它来代替本地获取 API。...如果您有足够的时间来处理 GraphQL API,我建议您使用 Apollo Client。可供选择的 GraphQL 客户端将是 urql 或 Relay。

    18.7K40

    spring框架思维导图,简约概括

    使用DAO支持类 配置数据源 使用JNDI数据源 使用数据源连接池 基于JDBC驱动的数据源 在Spring中使用JDBC 应对失控的jdbc代码 使用jdbc模版 在Spring中集成Hibernate...理解事务 用4个词来表示事务 理解spring对事务管理的支持 选择事务管理器 JDBC事物 Hibernate事务 Java持久化API事务 JTA(Java Transaction API)事务...在Spring中的编码事务 声明式事务 定义事务属性 在XML中定义事务 定义注解驱动的事务 使用Spring MVC构建Web应用程序 SpringMVC起步 跟踪SpringMVC的请求 搭建SpringMVC...保护Spring应用 Spring Security介绍 保护Web请求 保护视图级别的元素 认证用户 保护方法的调用 Spring集成 使用远程服务 Spring远程调用概览 使用RMI 使用Hession...和Burlap发布远程服务 使用Spring的HttpInvoker 发布和使用Web服务 为Spring添加REST功能 了解REST 编写面向资源的控制器 表达资源 编写REST客户端 提交RESTful

    1.3K60
    领券