Koa + GraphQL 示例

初始化项目

创建 graphql-example 文件夹进入后初始化一个 package.json 文件。

$ mkdir graphql-example && cd $_ $ yarn init -y

安装依赖

使用 koa-graphql 配合 koa-mount 两个 npm 模块来使用 GraphQL。同时需要安装 graphql 模块来创建需要使用的 schema。

$ yarn add koa graphql koa-graphql koa-mount

server

安装 koa 后，创建 server.js 实现一个简单的服务端。

server.js

const Koa = require("koa"); const app = new Koa(); app.use(async ctx => { ctx.body = "Hello World"; }); app.listen(3000); console.log("server started at http://localhost:3000");

通过 Node.js 启动后便可访问到页面了。

$ node server.js server started at http://localhost:3000

创建 schema

GraphQL 需要一个 schema 来初始化，创建 graphql 目录并在其中创建 schema.js 文件，

$ mkdir graphql $ touch graphql/schema.js

schema.js

const { buildSchema } = require('graphql'); const schema = buildSchema(` type Query { hello: String } `); module.exports = schema;

启动 GraphQL 服务

将上面的 schema 传入 koa-graphql 然后通过 koa-mount 将其作为中间件启动，便可开启 GraphQL 服务。

server.js

const Koa = require("koa"); const mount = require("koa-mount"); const graphqlHTTP = require("koa-graphql"); const schema = require("./graphql/schema"); const app = new Koa(); app.use( mount( "/graphql", graphqlHTTP({ schema: schema, graphiql: true }) ) ); app.listen(3000); console.log("server started at http://localhost:3000");

再次启动 server.js 并访问 http://localhost:3000/graphql 可看到一个可视化的 GraphQL 界面。该界面为 GraphQL 内置的 Graphiql 工具用于查询的调试。

Graphiql 界面

测试 GraphQL 服务

前面定义的 schema 中包含一个 hello 字段，通过在前面的 Graphiql 中编辑查询可请求该字段。

测试 Query

可以看到返回的数据为 null，这是因为我们还没有为该字段定义 resolver，即告诉 GraphQL 如何以及从哪里返回该数据。

添加 resolver

在 graphql 目录创建 resolver.js 文件，为 hello 字段指定数据的返回逻辑。

graphql/resolver.js

module.exports = { hello: () => "Hello world!" };

更新我们创建 GraphQL 服务的代码，将 resolver 传入：

server.js

const Koa = require("koa"); const mount = require("koa-mount"); const graphqlHTTP = require("koa-graphql"); const schema = require("./graphql/schema"); + const root = require("./graphql/resolver"); const app = new Koa(); app.use( mount( "/graphql", graphqlHTTP({ schema: schema, + rootValue: root, graphiql: true }) ) ); app.listen(3000); console.log("server started at http://localhost:3000");

再次启动服务并执行查询，能够看到返回了正确的数据。

返回数据的查询

相关资源

GraphQL DocumentationHow to setup a powerful API with GraphQL, Koa and MongoDB

转载于:https://www.cnblogs.com/Wayou/p/koa_graphql_example.html

相关资源：koa-graphql, 使用Koa创建 GraphQL HTTP服务器.zip