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