Laravel GraphQL 開発 入門

# input の利用

タスク追加の Mutation を実装する際に 以下のような GraphQL を定義しました。

type Mutation {
    createTask(name: String!, priority: Int!): Task!
}

入力するデータの項目が複数になってくると、 GraphQL の引数リストが複雑化し、 コードが読みにくくなってくるでしょう。

GraphQL では、Query や Mutation の引数をまとめるための input と呼ばれる仕組みが用意されています。

# input の利用

複数のタスクを一括で追加する Mutation を考えてみましょう。

複数のタスクを一括で追加するような処理では、 入力の値も配列となり、入力値の定義はやや複雑になります。

このようなケースでは input を利用して、 以下のような形で Mutation を定義することが出来ます。

input createTaskInput {
    name: String!
    priority: Int!
}

extend type Mutation {
    createTasks(tasks: [createTaskInput!]!): [Task!]!
}

createTasks(tasks: [createTaskInput!]!) のようにして、 入力値を createTaskInput の型で定義することで、 Mutation の定義をシンプルにまとめることが出来ます。

createTaskInput の定義は別途 input キーワードを利用して定義することが出来ます。

Mutation の実装は app/GraphQL/Mutations/CreateTasks.php を作成して以下のような形になります。

<?php
namespace App\GraphQL\Mutations;

use App\Models\Task;

class CreateTasks
{
    public function __invoke($rootValue, array $args)
    {
        $tasks = [];
        foreach ($args["tasks"] as $input) {
            $task = new Task();
            $task->name = "【{$input["name"]}】" ;
            $task->priority = $input["priority"];
            $task->save();
            $tasks[] = $task->refresh();
        }

        return $tasks;
    }
}

createTasks(tasks: [createTaskInput!]!) で定義した入力値は、 $args["tasks"] で取得することが可能です。

複雑な Mutation では、 altair でリクエストを発行する際にも工夫が必要です。

入力値が複雑なケースでは、以下のようにクエリを記述し、 クエリ下の variable の欄で実際の入力値を記述します。

Query

mutation($input: [createTaskInput!]!){
  createTasks(tasks: $input){
    name
    priority
  }
}

Variables

{
  "input": [
    {
      "name": "ミーティングの資料を作る",
      "priority": 3
    },
    {
      "name": "借りた本を返す",
      "priority": 5
    }
  ]
}

# Check!

次のステップに進む前に以下の内容をもう一度確認しておきましょう。

  • GraphQL で input を利用して、複雑な入力パラメータを定義できますか？
  • altair 側で入力値を variables を経由して送信することが出来ますか？

← Validation の実装 →