获取你所要的数据,不多不少:学习API查询语言GraphQL

获取你所要的数据,不多不少:学习API查询语言GraphQL

GraphQL是一种查询语言,由Facebook开发,在2015年开源。

GraphQL特点

和rest比较,可以避免多个请求,可以通过一次请求就获取你应用所需的所有数据

精准查询,查询你只需要的数据

向后兼容的,可以修改服务端而不影响已经存在的客户端

可以将已经存在的API包装起来,不需要从头开始

语言中立的,可以用各种语言实现

Github在2016年开始支持GraphQL

创建查询

使用Github的web界面进行查询练习

你需要有一个Github账号,登录下面的explorer查询界面

https://developer.github.com/v4/explorer/

获取你所要的数据,不多不少:学习API查询语言GraphQL

这就是一个简单的GraphQL查询:

query { 
viewer {
login
}
}

使用参数(使用Vue作者的用户名获取他的github主页)

{
repositoryOwner(login:"yyx990803"){
id
url
}
}

注意GraphQL中需要使用双引号,不能使用单引号。

获取你所要的数据,不多不少:学习API查询语言GraphQL

必填参数

这样查询repository会报错,需要必填参数owner

获取你所要的数据,不多不少:学习API查询语言GraphQL

添加上必填参数后

获取你所要的数据,不多不少:学习API查询语言GraphQL

使用别名

比如我们需要同时获取GraphQL和React这两个repository的信息,像下面这样写会报错

获取你所要的数据,不多不少:学习API查询语言GraphQL

这时候就可以使用别名写成

{
GraphQLProject:repository(name:"graphql",owner:"facebook"){
id
description
url

}
ReactProject:repository(name:"react",owner:"facebook"){
id
description
url
}
}
获取你所要的数据,不多不少:学习API查询语言GraphQL

使用Fragment

相当于代码重用

{
GraphQLProject: repository(name: "graphql", owner: "facebook") {
...repoFields
}

ReactProject: repository(name: "react", owner: "facebook") {
...repoFields
}
}
fragment repoFields on Repository {
id
description
url
}
获取你所要的数据,不多不少:学习API查询语言GraphQL

嵌套查询

获取你所要的数据,不多不少:学习API查询语言GraphQL

repository关联关系示意

获取你所要的数据,不多不少:学习API查询语言GraphQL

定义查询名称

query FirstFiveOrgMembers {
organization(login: "facebook") {
id
name
members(first: 5) {
edges {
node {
id
name
}

}
}
}
}

上面的查询等同于

{
organization(login: "facebook") {
id
name
members(first: 5) {
edges {
node {
id
name
}
}
}
}
}

只是添加了一个描述性的名称

使用变量

下图所示,通过定义变量$login传输参数,String!表示该变量是字符串,并且是必填的参数。

在Github GraphQL Explorer提供的左下角的地方传入login参数变量的值

获取你所要的数据,不多不少:学习API查询语言GraphQL

修改数据

使用mutation修改数据

在Github中我有一个repository叫GraphQL_Learning,这个repository中有一个issue

获取你所要的数据,不多不少:学习API查询语言GraphQL

添加留言

先查询这个个repository的issue,获取ID

获取你所要的数据,不多不少:学习API查询语言GraphQL

得到issue的ID为MDU6SXNzdWUzOTYxNzU1NTY=

通过下面的mutation脚本新加一条comment,注意其中subjectId需要填写上面查询出来的Id

获取你所要的数据,不多不少:学习API查询语言GraphQL

查看新的留言已经添加上去了:

获取你所要的数据,不多不少:学习API查询语言GraphQL

添加表情符号

获取你所要的数据,不多不少:学习API查询语言GraphQL

查看添加的表情符号

获取你所要的数据,不多不少:学习API查询语言GraphQL

有兴趣可以自行到Github网站上进行练习各种语法。


分享到:


相關文章: