GraphQLのインテグレーション
RetoolをGraphQL APIに接続します。
1. Retoolへの追加
Retoolで新規リソースを作成し、typeで「GraphQL」を選択します。APIエンドポイントを「Base URL」フィールドに入力します。APIに設定されている認証に応じて、URLパラメーターかヘッダーの入力、または「Authentication」ドロップダウンによるメソッドの設定が必要になります。認証の詳細についてはこちらを参照してください。
Resources > Add > GraphQL

2. クエリーの作成
これで、Retoolアプリケーション内でクエリーを作成するときに、新規作成したGraphQLのリソースをResourceドロップダウンから選択できるようになりました。
GraphQLクエリーには、Retoolの他のクエリーと大きく異なる点があります。それは引数です。Retoolの変数({{textInput.value}}
など)をクエリー本体に直接入れる代わりに、クエリー本体の中に引数を指定し、エディターの下にある「Variables」セクションでこれらをRetoolの変数に結び付けることができます。これでクエリーがかなり整頓されます。
ヒント
-
GraphQLクエリーの構文解析が行われます。ミューテーションの場合は、パラメーターの変更時にクエリーの自動リフレッシュが行われません。(REST APIの
POST
リクエストと似ています。) -
イントロスペクション・エンドポイントからスキーマが読み取られて、オートコンプリートとリンティングに使用されます。
-
GraphQLクエリーをきちんと再フォーマットするには、上部のバーのFormatボタンを押します。

GraphQLのクエリーの結果は、Retoolの他のクエリーの場合と同様に表示させることができます。

Updated 30 days ago