GraphQL 接口设计

graphql 是一种用于 API 的查询语言。它提供了一套完整的和易于理解的 API 接口数据描述,给客户端权力去精准查询他们需要的数据,而不用再去实现其他更多的代码,使 API 接口开发变得更简单高效。 最近在用Gatsby开发一版静态博客,感觉和这个框架真是相见恨晚。因为这个框架使用到了 graphql 技术,所以我花了点时间去学习了一下,并且记录了一下学习和思考过程。 本文主要讲解如何理解 graphql 以及基于关系型数据库设计 graphql 的思路。如果需要学习 graphql 基础知识,请移步官方文档 本文包含Nestjs + graphql 的示例项目:https://github.com/YES-Lee/nestjs-graphql-starter 理解 graphql graphql 是一个用于描述数据及其关系的查询语言,官方文档中描述了 graphql 的标准,具体的实现依靠第三方,目前主流的是Apollo提供的解决方案。 graphql 并不关心具体我们是怎么获取数据的,我们只需要提供获取数据的方法(resolver)以及如何组装数据(schema)。类似于 Java 开发过程中的接口设计模式,Graphql 定义了一套标准,我们按照标准实现接口。下面以用户-角色模型举例。 下面的代码定义了两个数据结构,与 JSON 类似,应该很容易理解。它描述了每个类型(type)的名称,以及其包含的属性。属性除了可以是基本类型外,也可以是数组、其他引用类型,从而建立起所有数据模型及相互的关系图。 type Role { name: String note: String } type User { id: Int name: String gender: Int role: Role } 上面代码用于描述Role和User的数据结构,那么我们具体要怎么使用这个东西呢?先从前端的角度来看,可以从官方文档学习到前端的基本使用,请求体中的数据描述和上面定义类型的代码有些许差别,比如我们要查询用户数据: query userInfo { user(id: Int) { id name gender role { name note } } } 从上面的代码可以大概猜测出,如果我们不需要查询role数据是,只需要将其从请求中去掉...

March 25, 2020 · 3 min · 464 words · Johnson

Apollo-Client 文件上传

使用apollo-client上传文件 apollo 文件上传 依赖 apollo-client apollo-link apollo-upload-client apollo-cache-inmemory 客户端创建 apolloClient.js import { ApolloClient } from 'apollo-client' import { createUploadLink } from 'apollo-upload-client' import { ApolloLink, from } from 'apollo-link' import { InMemoryCache } from 'apollo-cache-inmemory' const authLink = new ApolloLink((operation: Operation, forward) => { operation.setContext({ headers: { Authorization: getToken(), }, }) return forward(operation) }) const uploadLink = createUploadLink({ uri: `${API_URL}`, }) export const apolloClient = new ApolloClient({ link: from([authLink, uploadLink]), // uploadLink一定要放最后 cache: new InMemoryCache(), }) 使用 uploadFile....

September 19, 2019 · 1 min · 117 words · Johnson