1、入门

GraphQL是一种新的API标准可以替代REST.它是一种声明式的数据获取方式,让客户端可以从服务器端获取精确地所需的数据。和传统的提供多个端口,每个端口提供固定的数据不同,GraphQL只提供一个端口处理客户端所有的请求。

GraphQL是一种api查询语言,而不是数据库。在任何需要使用API的地方都可以使用GraphQL。

GraphQL比REST更加的高效。因为它定义了架构shcema和强类型系统(type system)帮助实现前后端分离,前后端团队只需要知道shcema和类型便可以进行各自的开发。schema定义了前端和后端通信的契约。

2、核心概念

(1)The schema define language SDL(架构定义语言)

 GraphQL有自己的类型系统去定义schema,定义schema的语法就是SDL.下面是一个简单的示例使用SDL定义一个Person type。

type Person {
  name: String!
  age: Int!
}

  person type有两个字段(field)分别是name,age,其中name的type是string,age的type是Int.在类型后跟!代表这个字段是必须的。

也可以使用SDL描述类型之间的关系,比如对于博客,作者和帖子是一对多的关系,使用SDL表述如下:

Post type。

type Post {
  title: String!
  author: Person!
}

  Person type

type Person {
  name: String!
  age: Int!
  posts: [Post!]!
}

  这样我们就建立了一个一对多的关系。

(2)使用query获取数据。

一个简单的query

{
  allPersons {
    name
  }
}

  allPersons被称为根字段,其他所有的查询都是在根字段下进行的。这将要返回在数据库中的所有的allPersons,以及allPersons下的所有name字段。 

{  
"allPersons": [
    { "name": "Johnny" },
    { "name": "Sarah" },
    { "name": "Alice" }
  ]
}

  虽然allPersons有name和age两个字段,但是age并没有显示。如果需要age显示则需要在请求中加入age字段。

GraphQL一个很大的便利是我们可以进行嵌套查询,比如我们想查询一个人(person)写的所有的帖子(posts),我们可以嵌套查询

{
  allPersons {
    name
    age
    posts {
      title
    }
  }
}

  这样我们便可以获取每个人的所有帖子了。

我们可以在schema中为每个字段定义0个或多个参数。例如我们可以定义last。这样我们在前端查询的时候便可以使用last进行查询,示例:

{
  allPersons(last: 2) {
    name
  }
}

  (3)使用mutation写入数据。

mutation的类型有三种:

增加

修改

删除

mutation和query的结构完全相同,它以mutation开始,示例

mutation {
  createPerson(name: "Bob", age: 36) {
    name
    age
  }
}

  mutation的根字段是createPerson,createPerson有两个参数一个是name,一个是age。和query类似,我们也可以在根字段后面跟其拥有的字字段,以显示新创建的person相关的信息,这里我们使用了name和age,这看起来是没有必要的,因为我们刚刚自己输入了这些信息,没有必要再向服务器请求相同的字段信息。服务器将要返回:

"createPerson": {
  "name": "Bob",
  "age": 36,
}

  如果我们的person有个自增Id属性,那么我们便可以在新增数据时候获得这个id,示例:

mutation {
  createPerson(name: "Alice", age: 36) {
    id
  }
}

  (4)使用subscroptions进行实时更新。

客户端订阅事件,当服务端事件触发时,服务端自动向客户端发送新的数据。subsciptions和query,mutation的语法一致,示例:

subscription {
  newPerson {
    name
    age
  }
}

  当客户端发送一个subscription到服务器端的时候,客户端和服务器端便建立了连接,每当服务器端新增一个Person的时候,服务器端便会向客户端发送新增person的信息。

(5)定义schema

schema是在使用GraphQL当中最重要的一个概念了,他定义了前端如何向服务端请求数据。像是前端和后端的一个协议。

简单来说,schema就是一组GraphQL types的集合。有一些特殊的根类,如:

type Query { ... }
type Mutation { ... }
type Subscription { ... }

  Query,Mutation和Subscripion三个是客户端的入口程序。为了能够让客户端向前面一样请求allperson的数据,我们需要这样定义Query

type Query {
  allPersons: [Person!]!
}

  allPersons是这个API的根field,为了能够让客户端向上面一样使用参数last访问服务端,schema必须也增加相应的参数,示例:

type Query {
  allPersons(last: Int): [Person!]!
}

  相同的,为了让客户端使用createPerson,我们需要定义:

type Mutation {
  createPerson(name: String!, age: Int!): Person!
}

  subscription对应的schema是:

type Subscription {
  newPerson: Person!
}

  本节完整的schema是:

type Query {
  allPersons(last: Int): [Person!]!
}

type Mutation {
  createPerson(name: String!, age: Int!): Person!
}

type Subscription {
  newPerson: Person!
}

type Person {
  name: String!
  age: Int!
  posts: [Post!]!
}

type Post {
  title: String!
  author: Person!
}