GraphQLでパラメータを投げる

最近GraphQLを使っているのですがリクエストにパラメータを乗せるのに四苦八苦したのでメモしておきます。

const express = require('express')
const graphqlHTTP = require('express-graphql')
const {
  graphql,
  GraphQLSchema,
  GraphQLObjectType,
  GraphQLList,
  GraphQLString,
  GraphQLInt,
  GraphQLInputObjectType,
  GraphQLNonNull
} = require('graphql');
const atob = require('atob');

const postType = new GraphQLList(
    new GraphQLObjectType({
      name: 'post',
      fields: {
        id: { type: GraphQLInt },
        imageUrl: { type: GraphQLString },
        created_at: { type: GraphQLString },
        updated_at: { type: GraphQLString }
      }
    })
  )

function getPosts(limit) {
  return [
    { imageUrl: 'aaaaa' },
    { imageUrl: 'bbbbb' }
  ]
}

const schema = new GraphQLSchema({
  query: new GraphQLObjectType({
    name: 'Query',
    fields: () => ({
      post: {
        type: postType,
        args: {
          limit: { type: GraphQLInt }
        },
        resolve: (value, { limit }) => {
          return getPosts(limit)
        }
      }
    })
  })
});

var app = express();
app.use('/graphql', graphqlHTTP({
  schema: schema,
  graphiql: true,
}));
app.listen(4000, () => console.log('Now browse to localhost:4000/graphql'));

以下のリクエストを投げて結果を確認します。getPostsは任意の名前、postはフィールド名、limitは引数名、imageUrlはpostで返ってくるpostTypeの属性名です。

query getPosts {
  post(limit: 10) {
    imageUrl
  }
}

$ node index.jsをするとgraphiqlが見えてレスポンスを確認できます。

f:id:asmsuechan:20180902155059p:plain

コードを書くときはgraphql-jsのテストが参考になります。

https://github.com/graphql/graphql-js/blob/master/src/tests/starWarsQuery-test.js

https://github.com/graphql/graphql-js/blob/master/src/tests/starWarsSchema.js

にしてもGraphQLめちゃくちゃ取っつきにくいですね。RESTは思考停止でも書けるってことを強く感じました。