GraphQL + RailsでDBからデータ取得までのメモ

GraphQL + Rails な環境で、 DB のusersテーブルの中のidemailGraphiQL上で取得するところまでのメモ

最終的に http://localhost:3000/graphiql にアクセスして、下記のクエリを実行して、

query {
  user {
    id
    email
  }
}

下記になったらゴールのところまで

{
  "data": {
    "user": {
      "id": 1,
      "email": "[email protected]"
    }
  }
}

まずは rails プロジェクトを作成

rails new graphql-rails-example

DB 作成

rails db:create

Gemfile'graphql'を追加(これを書いてる時の最新バージョンは 1.8.10) ※2018 年 5 月ぐらいのバージョン 1.8+からClass-Based APIに変わり実装が変わって、 昔の.define-styleな書き方だとエラー出ちゃうので、Class-Based APIで実装していく

gem 'graphql'

インストール

bundle

graphqlは最初の雛形を作る便利な generate があるので、 それを使ってもろもろ必要なファイルを生成(Class-Based APIベースなファイルが生成される)

rails g graphql:install

これで必要なファイルが生成されるのと同時に、Gemfilegem 'graphiql-rails', group: :developmentが追加されて GraphiQLっていうブラウザ上で GraphQL の query とか mutation とかを叩いて試せる GUI が操作出来るようになるので、それをインストール

bundle

ローカルサーバーの立ち上げ

rails s

http://localhost:3000/graphiql にアクセスして、下記の query を実行 testFieldが取れるか確認する

query {
  testField
}

Hello World!が取れてたら OK!

{
  "data": {
    "testField": "Hello World!"
  }
}

今度は本題の DB に格納された値を取得したいので、User Model を作成

rails g model User name:string email:string

migrate して、users テーブルを作成

rails db:migrate

GraphQL用の generate コマンドが準備されてるので、 それを使って User Type を生成する

rails g graphql:object User id:Int! email:String

これでapp/graphql/types/user_type.rbが生成される そして、実際に DB の中にデータを入れるのでrails cして

rails c

1 件データを挿入

User.create!(id: 1, email: '[email protected]')

User.count # 1

DB に追加した User を取得したいので、app/graphql/types/query_type.rbに下記を追加する

field :user, Types::UserType, null: false, resolve: ->(obj, args, ctx) { User.first }

resolveのところで、どのデータを返すのか、データを加工して返したいとかロジックを書くことができる 実際にはログインしている User をctx[:current_user]とかで返すことになりそう fieldの書き方はClass-Based APIになって変わったので、昔の書き方だとエラーが出る 今回はサンプルなので、User.firstで最初の User を返すようにした

graphiql の方で下記の query を実行

query {
  user {
    id
    email
  }
}

下記のようにちゃんとデータが取れてたら、OK..!

{
  "data": {
    "user": {
      "id": 1,
      "email": "[email protected]"
    }
  }
}

参考 この Youtube の解説動画が分かりやすかったです Rails + GraphQL Tutorial - Building a GraphQL API Server