AmplifyをつかってAppSyncのsubscriptionに引数を持たせたい #GraphQL

1.経緯

ネットの記事をみてると、Amplifyのバージョンが古い？ためかそのまま書くとエラーがでたので、ここに記録として記載しておきます

デフォルトのままだと全てのデータをsubscription（購読）してくるので、特定のRoomIDを持ったコンテンツだけsubscriptionを発生させたい。

イメージ的にはAmplify/ディレクトリにあるschema.graphqlを使って、デフォルトのsubscriptionを生成するのではなく、引数を持ったsubscriptionを生成させたい。みたいな感じです。

2.結果

schema.graphqlの@modelのあとに subscriptions: null の引数をもたせることで、Amplifyが勝手につくってくれるはずのsubscriptionに引数をもった関数に書き換えすることができました。あとは引数を持たせたい関数を設定しましょう。今回はonCreateTodoのみがroom_idをsubscriptionしてきます。

schema.graphql

type Todo @model(subscriptions: null) {
  id: ID!
  room_id: String
  content: String
  description: String
}

type Subscription {
  onCreateTodo(room_id: String): Todo @aws_subscribe(mutations: ["createTodo"])
}

3.解説

上記の内容に書き換えて、Amplify push をしたら src/graphql ディレクトリ以下にある subscriptions.js にも勝手に引数を付けてデプロイしてくれました✨

下の内容に変わったことを確認したら、onCreateTodoを使っている各ファイルに以下の引数を持たせましょう。これで引数の値がsubscriptionされていることを確認できると思います。

subscriptions.js

export const onCreateTodo = /* GraphQL */ `
  subscription OnCreateTodo($room_id: String) {
    onCreateTodo(room_id: $room_id) {
      id
      room_id
      content
      description
      createdAt
      updatedAt
    }
  }
`;

4.最後に

よろしければいいね👍くださると励みになります✨