GraphQL Subscriptionとは？欲しいデータだけ購読する
Query・Mutation に並ぶ3つ目の操作。中身は WebSocket
GraphQL SubscriptionはQuery/Mutationと並ぶGraphQLの3番目のオペレーションタイプです。内部的にWebSocketをtransportとして使用し、GraphQLスキーマに定義された型システムを通じて、どのイベントを購読するか、どのフィールドを受け取るかを宣言的に指定できます。
構造ダイアグラム
🌐
クライアント
subscription {
messageAdded {
id
text
}
}
messageAdded {
id
text
}
}
① subscriptionクエリ
→
WebSocket
←
④ データpush
🖥️
GraphQLサーバー
② サブスクリプション登録
③ Mutation発生
←
✏️
Mutation
データ変更トリガー
フロー説明
- クライアントがsubscriptionクエリを送信（WebSocket接続）
- サーバーが該当イベントのサブスクリプションを登録
- 他のクライアント/システムがMutationでデータを変更
- サーバーがサブスクリプション中のクライアントにGraphQL形式でpush
動作フロー
1
クライアントがsubscriptionクエリをサーバーに送信（WebSocket接続）
2
サーバーが該当イベントの購読を登録
3
サーバー側でデータ変更（Mutation）が発生
4
サーバーが購読中のクライアントにGraphQL形式でデータをpush
メリット
- ✓ 型安全なリアルタイム通信
- ✓ 必要なフィールドのみ選択的に購読
- ✓ 既存のGraphQLスキーマと統合
- ✓ Query/Mutationと一貫した開発体験
デメリット
- ✗ WebSocket上に追加の抽象化レイヤー
- ✗ サーバー実装の複雑度が高い
- ✗ N+1購読問題の可能性
- ✗ スケーリング時にPub/Subバックエンドが必要
ユースケース
リアルタイムコメント/通知
注文状態追跡
コラボレーションツールのリアルタイム同期
GitHubのGraphQL API