Naoki Otsu

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

2018-11-02

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

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

query {
  user {
    id
    email
  }
}

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

{
  "data": {
    "user": {
      "id": 1,
      "email": "hoge@example.com"
    }
  }
}

まずは 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: 'hoge@example.com')

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": "hoge@example.com"
    }
  }
}

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