hasura-rest-hands-on/docs/insert-and-select.md

GraphQLによるデータの挿入と取得

GraphQLによるデータの操作を行ってみましょう。

コンソールのトップ画面に戻ると、GraphiQL (GraphQLのプレイグラウンド、開発環境) を使ってGraphQL APIを実際に試すことが可能です。

データの挿入

まずGraphQLでデータの挿入を試します。ここでは例として pages テーブルに次のデータを書き込みます。

項目	説明	値
content	ページの本文	{} - 空のオブジェクト

GraphQL Queryとしては次のコードを書いて、▶ ボタンからリクエストを行います。

mutation MyMutation {
  insert_pages_one(object: {content: {}}) {
    id
    content
  }
}

サーバーにリクエストを発行しレスポンスボディとして得られたデータは、右側のパネルに表示されます。

問題無くJSONのデータが得られたら、別のデータの書き込みを試してみます。

例として pages テーブルに次のデータを書き込みます。

項目	説明	値
content	ページの本文	{hey: "hello"}

mutation MyMutation {
  insert_pages_one(object: {content: {hey: "hello!"}}) {
    id
    content
  }
}

レスポンスを見ると問題なく id (ページの識別子) が得られており、正しく割り当てられ、テーブル内に書き込まれているようですね。

実際にデータベースのテーブルに書き込まれていることを確認してみます。[Data Manager] > [View Database] > pages テーブルを選択すると[Browse Rows]パネルでテーブル内のデータを確認することが可能です。

先ほどのGraphQL Queryリクエストが問題なく発行され、正しくデータが書き込まれていますね。

データの取得

上述の pages テーブル内からGraphQLでデータの取得を試します。取得するために、データに割り当てられた id を使います。

GraphQL Queryとしては次のコードを書いて、▶ ボタンからリクエストを行います。

query MyQuery {
  pages_by_pk(id: 2) {
    id
    content
  }
}

レスポンスを見ると、問題なく先ほど書き込まれたのテーブル内データが得られていますね。

項目	説明	例
id	ページの識別子	2
content	ページの本文	{hey: "hello"}

GraphQLでデータの挿入と取得を実際に試してみて、いかがでしたか。

このハンズオンではGraphQLの具体的なオペレーション mutation や query、Hasuraの提供しているデータのCRUDのためのフィールド insert_* や *_by_pk について詳しくは説明しません。しかし実際にはここで紹介した以外にもさまざまな操作を行うことが可能です。[Explorer]のパネルから実行可能な操作や型、あるいは右側の[< Docs]等からGraphQLの型の詳細を参照してみると、実際の操作の参考になるかと思います。