我创建了一个名为 GraphQL-Rest-Proxy 的工具，它可以将 REST API 转换为 GraphQL 服务器。

行動的原因

假设GraphQL很棒，因此想要将REST API迁移到GraphQL。但是，替换现有的REST API为GraphQL可能会很困难。

使用 graphql-rest-proxy，可以在不影响现有的 REST API 的情况下运行 GraphQL 服务器。

安装

npm -g install graphql-rest-proxy

在中国，您可以选择使用Yarn。

yarn global add graphql-rest-proxy

使用方法

步骤1. 定义GraphQL的模式

type User {
  id: Int
  name: String
  isActive: Boolean
}

type Query {
  getUser: User @proxy(get: "https://my-rest-api.com/user")
}

第二步：启动代理服务器。

graphql-rest-proxy schema.graphql

# => graphql-rest-proxy is running on http://localhost:5252

第三步。从客户端发送GraphQL请求。

curl -XPOST -H 'Content-Type: application/json' \
    -d '{ "query": "{ getUser { id name isActive } }" }' \
    http://localhost:5252/graphql

会得到这样的回答。

{
  "data": {
    "getUser": {
      "id": 1,
      "name": "Tom",
      "isActive": false
    }
  }
}

架构定义示例

基本查询

type User {
  id: Int
  name: String
}

type Query {
  getUser: User @proxy(get: "https://my-rest-api.com/user")
  getUsers: [User] @proxy(get: "https://my-rest-api.com/users")
}

带有参数的查询

ID这个查询参数可以通过$id这个变量名来引用。

type User {
  id: Int
  name: String
}

type Query {
  getUserById(id: Int!): User @proxy(get: "https://my-rest-api.com/users/$id")
}

输入参数

Mutation会将variables发送到REST API中。

type UserInput {
  name: String!
}

type User {
  id: Int
  name: String
}

type Mutation {
  createUser(user: UserInput!): User @proxy(post: "https://my-rest-api.com/users")
  updateUser(id: Int!, user: UserInput!): User @proxy(patch: "https://my-rest-api.com/users/$id")
}

请求示例

fetch('http://localhost:5252/graphql', {
  method: 'patch',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    query: gql`
      mutation UpdateUser($id: Int!, $user: UserInput!) {
        updateUser(id: $id, user: $user) {
          id
          name
        }
      }
    `,
    variables: {
      id: 1,
      user: {
        name: 'acro5piano',
      },
    },
  }),
})

嵌套对象

您可以使用 $id 引用家長 ID。

type Post {
  id: Int
  title: String
}

type User {
  id: Int
  name: String
  posts: [Post] @proxy(get: "https://my-rest-api.com/users/$id/posts")
}

type Query {
  getUser: User @proxy(get: "https://my-rest-api.com/user")
}

设置基本 URL

为减少冗长的描述，您可以通过设置一个名为 “baseUrl” 的CLI选项来实现。

graphql-rest-proxy --baseUrl https://my-rest-api.com schema.graphql

type Query {
  getUser: User @proxy(get: "/user")
}

时间点

如果子对象包含在响应中，为了满足最小的请求，将返回它。

假设 Schema 如下所示

type Post {
  id: Int
  title: String
}

type User {
  id: Int
  name: String
  posts: [Post] @proxy(get: "https://my-rest-api.com/users/$id/posts")
}

type Query {
  getUser: User @proxy(get: "https://my-rest-api.com/user")
}

当 REST API 返回以下类似响应时，

curl https://my-rest-api.com/user

{
  "id": 1,
  "name": "acro5piano",
  "posts": {
    "id": 1,
    "title": "graphql-rest-proxy"
  }
}

由于帖子(posts)已包含在用户(user)中，graphql-rest-proxy不会向https://my-rest-api.com/users/1/posts发出请求。

請參考以下連結獲取詳細資訊：https://github.com/acro5piano/graphql-rest-proxy

给你一份小礼物

这次我换了一下，使用 @pika/pack，之前一直用 Rollup.js 的打包工具。

在 Rollup 中，指定可执行命令和像 Webpack 那样嵌入代码都相当麻烦，但现在几乎可以自动配置，非常方便。@pika/pack 也是我希望有一天能写篇文章介绍的。