Egg.js 中 GraphQL 小試牛刀

Egg.js 筆記系列

繼上上篇擼完了簡易版的阿里雲 CS 控制台，用 GraphQL 繼續武裝一番~

1. 安裝&配置

1.1 安裝插件

yarn add egg-graphql

1.2 開啟插件

// {rootDir}/config/plugin.jsuse strict;// had enabled by egg// exports.static = true;exports.graphql = { enable: true, package: egg-graphql,};

1.3 配置插件

// {rootDir}/config/config.{env}.js// 載入中間件，使用訪問：http(s)://{host}:{port}/graphqlexports.middleware = [ graphql ];exports.graphql = { router: /graphql, // 是否載入到 app 上，默認開啟 app: true, // 是否載入到 agent 上，默認關閉 agent: false,};

2. 使用

2.1 基本結構

// {rootDir}/app/graphql.├── common│ ├── resolver.js│ ├── scalars│ │ └── date.js│ └── schema.graphql├── docker│ ├── connector.js│ ├── resolver.js│ └── schema.graphql└── query ├── resolver.js └── schema.graphql

2.2 Query

schema

// query/schema.graphqltype Query { docker: Docker}

resolver

use strict;module.exports = { Query: { docker(root, params, ctx) { return []; }, },};

2.3 Docker

schema

// docker/schema.graphqltype Docker { images(id: Int, limit: Int, offset: Int): [Image] clusters(name: String): [Cluster]}type Image { id: Int! namespace: String! region: String! name: String! repo_full_name: String! tags: [Tag]}type Tag { id: Int! digest: String! tag: String! pushed_at: Date! }type Cluster { id: Int! name: String! region: String! created_at: Date! # masterUrl: String! # ca: String! # key: String! # cert: String!}

resolver

// docker/resolver.jsuse strict;module.exports = { Docker: { images(parent, { id, limit, offset }, ctx) { return ctx.connector.docker.getImages(id, limit, offset); }, clusters(parent, { name }, ctx) { return ctx.connector.docker.getClusters(name); }, },};

嵌套結構下，第一個參數為上層的結果，Query 下為 root，Docker 下為上層的結果

3. 效果

4. 鏈接

• Egg.js+Antd 擼個簡易版阿里雲CS控制台？
• 在egg中使用GraphQL
• freebyron/egg-graphql-boilerplate
• eggjs/egg-graphql

推薦閱讀：