GraphQL

[cassiehuang]

• GraphQL 是一种可以替代REST的API对于API查询方式的思考
• Restful的api，就是定义了一系列用户可以使用的api， 客户端可以通过/book/的方式检索资源，而这个被检索到的资源和获取资源的方式是耦合的，也是有服务端定义的
• 意思是一个restful的api，定义了一种endpoint的返回
• 而使用GraphQL, 服务端仅定义数据的类型，这是对该资源的描述，与检索方式无关
• 如果我们要访问特定的资源，就需要在模式中创建一个Query类型，然后就可以发送请求
• 在客户端发起请求时，可以规定返回哪些字段

  
  // 创建模式，模式内包含很多类型，Query是必须的
  const schema = buildSchema(`
  type Query {
  hello: String,
  book: [Book],
  author: String,
  }
  // 这是资源类型的定义
  type Book {
  id: Int,
  title: String,
  }
  `);

const root = { hello: () => 'hello world', author: () => 'hello author', book: () => ([{ id: 1, title: 'cassie book'}, { id: 2, title: 'cassie book 2'}]) };

// 发起请求 graphql(schema, '{ book { title }}', root).then((response) => { console.dir(response.data); })

* 假设一个场景，用户需要获取关于某个用户的详细信息，多个地方用到，分别需要不同的参数，有的选择全部返回，有的则需要设置多个restful接口来取不同的数据
* 如果使用graphql, 则只需要定义一种query type， graphql内部会根据请求的参数返回相应的数据
* 假设用户查找某一类别名下的所有商品，那么服务器需要3个接口，根据类别名查找类别id，根据类别id查找商品
* resuful的，用户必须新增一个接口，来根据类别名查找类别商品，里面两次query
* graphql，则不需要。只需要定义两次query的结构就可以了

[cassiehuang]

apollo graphql

• 我们平时使用redux，vuex等做状态管理，其核心就是store，我们经常用它来存储后台返回的数据，每次请求就是发起一个action，然后更新data，映射到props，我们需要在合适的生命周期发起这个action
• 使用apollo，我们只需要定义查询语句，使用graphql将其绑定到Comment组件上，然后就可以了，我们不需要定义什么时候发起请求，怎么处理请求数组，这些都委托给了apollo client去实现
• 同时更新也更加简单，以前我们一般是发起一个更新请求，成功后再发起一个查询请求，数据才会更新
• 而使用apollo，我们发起更新请求后，apollo client 会把数据按照类型自动缓存在cache中，那么列表就自动更新了，即graphql节点返回的任何数据都会自动被用来更新缓存
• apollo 定义了很多自动缓存的逻辑，可以配置每次请求使用缓存的策略，可以优先使用缓存，也可以每次都重新发起请求
• apollo实际上就是之前视图和data的中间层，视图定义使用graphql，然后apollo client 就使用相应的方式返回数据或者发起网络请求，

[cassiehuang]

apollo-graphql

• Apollo 是一个由社区驱动开发的 GraphQL client
• apollo-client apollo 所有操作都从这里开始
• apollo实际上选择的理由就是，支持了graphql，可以进行状态管理，可以自己处理网络问题，数据缓存等问题

[cassiehuang]

• graphql 核心：scheme，resolvers