Koa2 中的 GraphQL 服务端实现教程-JavaScript中文网-JavaScript教程资源分享门户

GraphQL 是一种用于 API 的查询语言，类似于 REST，但更加灵活和强大。在前端开发领域，GraphQL 已经成为非常流行的技术，被广泛应用于移动端和 Web 应用程序中。在这篇文章中，我们将介绍如何在 Koa2 中实现 GraphQL 服务端。同时，我们也会提供示例代码和相关指导。

GraphQL 简介

GraphQL 是一种用于 API 的查询语言，由 Facebook 在 2012 年开发，于 2015 年开源。GraphQL 的主要特点如下：

定义精确的数据结构，减少无用数据的传输；
使用内置类型系统，提供类型检查机制；
可以在一个请求中获取多个资源。

相较于 REST，GraphQL 有以下优势：

客户端可以精确地指定需要的数据；
服务端可以精确地提供数据，避免无用数据的传输；
GraphQL 可以通过嵌套查询和关联查询实现多个数据之间的关联。

Koa2 是一个基于 Node.js 的 Web 框架，它提供了异步函数编程的方式，优化了代码的执行效率。与 Express 相比，Koa2 的中间件机制更加灵活和简洁。下面我们就来介绍如何在 Koa2 中实现 GraphQL 服务端。

1. 安装依赖

我们首先需要安装使用 GraphQL 的依赖包。我们可以通过 npm 安装 graphql、koa、koa-static、koa-graphql、koa-router、lodash 和 nodemon 依赖。

npm i graphql koa koa-static koa-graphql koa-router lodash nodemon

2. 创建 GraphQL Schema

在开始实现 GraphQL 服务端之前，我们需要确定自己的数据结构。在 GraphQL 中，我们使用类型来表示数据结构。下面是一个简单的示例类型：

const {
  GraphQLObjectType,
  GraphQLID,
  GraphQLInt,
  GraphQLString,
  GraphQLNonNull,
  GraphQLSchema
} = require('graphql');

const UserType = new GraphQLObjectType({
  name: 'User',
  fields: {
    id: { type: GraphQLID },
    name: { type: new GraphQLNonNull(GraphQLString) },
    age: { type: GraphQLInt }
  }
});

const schema = new GraphQLSchema({
  query: new GraphQLObjectType({
    name: 'Query',
    fields: {
      user: {
        type: UserType,
        args: {
          id: { type: GraphQLID }
        },
        resolve: (_, { id }) => { ... }
      }
    }
  })
});

代码解释如下：

我们使用 GraphQLObjectType 定义 UserType 类型，包含 id、name、age 字段；
我们使用 GraphQLNonNull 包裹 String 类型，表示 name 字段不能为空；
我们使用 GraphQLSchema 定义 schema，包含 Query 类型；
Query 类型中包含 user 字段；
user 字段包含 id 参数，返回 UserType 类型；
我们使用 resolve 函数处理 user 查询，负责从数据库、API 或文件中获取数据。

3. 创建 Koa2 中间件

我们需要创建一个 Koa2 中间件，接收来自客户端的请求，根据请求内容返回相应的数据。在 Koa2 中创建 GraphQL 中间件非常简单，只需要使用 koa-graphql 中间件即可。

const Koa = require('koa');
const koaStatic = require('koa-static');
const koaRouter = require('koa-router');
const { graphqlKoa } = require('koa-graphql');
const { schema } = require('./schema');

const app = new Koa();
const router = new koaRouter();

router.post('/graphql', graphqlKoa({ schema }));

app.use(koaStatic('./public'));
app.use(router.routes());

app.listen(3000);

代码解释如下：

我们创建了一个 Koa 实例，并创建了一个 koa-router 实例；
我们使用 graphqlKoa 工具将 schema 传入，这样就可以根据请求返回相应的数据；
我们创建了一个路由，路径为 /graphql；
graphqlKoa 中间件会自动根据请求的 method（例如 POST、GET 等）和参数（例如 query、variables）来返回数据。

4. 测试 GraphQL API

我们首先可以通过 cURL 工具测试 GraphQL API 是否能够正常返回数据。只需要向 /graphql 路径发送一个 POST 请求，包含以下参数：

query：需要查询的 GraphQL 语句；
variable：请求所需的变量；

以下是一个示例请求：

curl -X POST -H 'Content-Type: application/json' -d '{"query": "{user(id: 1) {id name age}}"}' http://localhost:3000/graphql

返回结果应该类似于以下内容：

{ "data": { "user": { "id": 1, "name": "Name", "age": 20 } } }

我们也可以通过 GraphiQL 工具测试 GraphQL API，GraphiQL 是一个交互式的 GraphQL IDE，可以方便地编写和测试 GraphQL API。只需要在浏览器中打开 /graphql 路径，就可以开始使用 GraphiQL 工具。

const { graphql } = require('graphql');
const schema = require('./schema');
const query = '{ user(id: "1") { id name } }';

graphql(schema, query).then(result => {
  console.log(result.data);
});

代码解释如下：

我们可以使用 graphql 工具来执行 GraphQL 查询；
我们指定了使用 schema 来执行查询；
我们执行一个简单的查询，查询 User 类型中 id 和 name 字段。

总结

在这篇文章中，我们介绍了如何在 Koa2 中实现 GraphQL 服务端。我们学习了 GraphQL 的基础知识，并提供了一些示例代码和相关指导。GraphQL 是一种强大的 API 查询语言，可以为前端开发带来很多便利。在实际项目中，我们可以根据需求灵活地使用它。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/65b6020badd4f0e0ffeb8ef1