之前请某个我的咨询客户的公司建议他们使用graphql，还专门做了一个培训，然后过了一段时间一问，说还没做，回复原因是一堆常见的你懂得。

我就说这个玩意有什么难！结果看了官方文档，以及类似这样的：juejin.cn/post/684490… ,

真是一堆绕着圈子的屁话啊。

不得已出马，拍出一个入门文档。请对比了解什么叫做简洁，什么叫做不罗嗦不聒噪，艹。

有node基础的，10分钟学会。

Hello World！使用 GraphQL

现在我们来写我们第一个基于express的 GraphQL 服务器。本教程中，我们将使用 Apollo Server库。为此，我们需要安装三个包

1	复制代码npm install --save graphql apollo-server-express express

才能使用 Express 应用程序作为中间件。

graphql 是一个支持库，apollp-server-express 是相应的 HTTP 服务器支持包express 是 Nodejs 的 web 框架。

开始

复制代码让我们简要了解下这些依赖的作用。

新建一个名字为 index.js，包含以下代码的文件：

复制代码const express = require('express');
const { ApolloServer, gql } = require('apollo-server-express');
const typeDefs = gql`
	type Query {
		hello: String
	}
`;
const resolvers = {
	Query: {
		hello: () => 'Hello world!'
	}
};
const server = new ApolloServer({ typeDefs, resolvers });
const app = express();
server.applyMiddleware({ app });
app.listen({ port: 4000 }, () =>
	console.log(`🚀 Server ready at http://localhost:4000${server.graphqlPath}`)
);

gql 是一个模板文字标记，用于将 GraphQL schema 编写为类型。schema由类型定义组成,上面的例子中，我们定义了 typeDefs 来编写 graphQL 的 schema。

Resolver 用于从 schema 中返回字段的数据。在我们的示例中，我们定义了一个 resolver，它将函数 hello() 映射到我们的 schema 上的实现。

要运行服务器，只需要打开 terminal 并运行命令
node index.js。

现在，从浏览器窗口访问 url：

1	复制代码http://localhost:4000/graphql

来看看它的操作。要运行一个 query，在左侧编辑空白部分，输入以下 query。

1	复制代码{hello}

然后按中间的 ▶ （play）按钮。查看输出：

复制代码{
  "data": {
    "hello": "Hello world!"
  }
}

瞧！你刚创建了第一个 GraphQL 服务器。

命令行验证服务启动

能够通过命令即可验证的话，就不必急着写代码，因为前者飞快简洁。

操作系统差异，关于单引号和双引号，真tm的折腾人。

Linux | MAC

命令

1	复制代码curl -i -X POST -d'{query: "{hello}"}' http://localhost:4000/graphql

Windows

命令

1	复制代码 curl -X POST -H "Content-Type: application/json" -d"{\"query\":\"{hello}\"}" http://localhost:4000/graphql

输出

1	复制代码 {"data":{"hello":"Hello world!"}}

使用 GraphQL 构建 API

接下来做一个看起来像是真的应用的案例，这次我们添加一个像样的Person对象和对它的查询和修改。

添加 Schema。我们需要一个 schema 来启动我们的 GraphQL API。让我们在 api 目录下创建一个名字为 api/schema.js 的新文件。添加以下 schema。

复制代码const typeDefs = gql`
type Person {
    id: Int
    name: String    
}
type Query {
    allPeople: [Person]
    person(id: Int!): Person
}
type Mutation {
    createPerson(id:String,name: String): Person
}
`;
const defaultData = [
    {
        id: 1,
        name: 'Reco'        
    },
    {
        id: 2,
        name: 'Tibe',        
    }
];

复制代码我们的 schema 一共包含两个 query：

第一个是 allPeople，通过它我们可以列出到 API 中的所有的人
第二个查询 person 是使用他们的 id检索一个人
还有一个修改createPerson，必须放到type Mutation 内

这两种查询类型都依赖于一个名为 Person 对象的自定义类型，该对象包含2个属性。

添加 Resolver

我们已经了解了 resolver 的重要性。它基于一种简单的机制，去关联 schema 和 data。Resolver 是包含 query 或者 mutation 背后的逻辑和函数。然后使用它们来检索数据并在相关请求上返回。

如果在使用 Express 之前构建了服务器，则可以将 resolver 视为控制器，其中每一个控制器都是针对特定路由构建。由于我们不在服务器后面使用数据库，因此我们必须提供一些虚拟数据来模拟我们的 API。
创建一个名为 resolvers.js 的新文件并添加下面的文件:

复制代码const defaultData = [
    {
        id: 1,
        name: 'Reco'        
    },
    {
        id: 2,
        name: 'Tibe',        
    }
];
const resolvers = {
    Query: {
        allPeople: () => {
            return defaultData;
        },
        person: (root, { id }) => {
            return defaultData.filter(character => {
                return (character.id = id);
            })[0];
        }
    },
    Mutation:{
        createPerson:(root,{id,name}) =>{
            defaultData.push({id,name})
            return defaultData[defaultData.length - 1 ]
        }
    }
};

首先，我们定义 defaultData 数组，其中包含2个人物的详细信息。person() 箭头函数使用参数 id 来检索具有请求 ID 的 person 对象。这个已经在我们的查询中定义了。

实现服务器

运行服务器。现在要测试我们的 GraphQL API，在浏览器窗口中跳转

1	复制代码http://localhost:4000/graphql

并运行以下 query：

{allPeople{id,name}}

复制代码点击 play 按钮，你将在右侧部分看到熟悉的结果，如下所示。

复制代码{
  "data": {
    "allPeople": [
      {
        "id": 1,
        "name": "Reco"
      },
      {
        "id": 2,
        "name": "Tibe"
      }
    ]
  }
}

要获取单个人物对象，请尝试运行:

1	复制代码{person(id:1){id,name}}

要创建一个person：

1	复制代码mutation{createPerson(id:"4",name:"reco"){id,name}}

复制代码运行上面的查询，在结果中，你可以获得得到的每个字段/属性的值以进行查询。你的结果将类似于以下内容。

结论

结论就是这就是一个很简单的玩意儿，只是上个，哪里需要那么多屁话。

本文转载自: 掘金

开发者博客 – 和开发相关的这里全都有