タダです.

前回の記事で「初めてのGraphQL」を読んだ感想を書いたのですが,AWS にはマネージド GraphQL サービスの AWS AppSync があります.このサービスの概観をさらいたくて「AWS AppSync immersion day workshop」をやってみました.このワークショップを通じてやる内容や学べたことをまとめていきます.

ワークショップの概要
ワークショップを通じて学べると感じたこと
まとめ

ワークショップの概要

「AWS AppSync immersion day workshop」の内容は大まかに以下の通りです.

マネジメントコンソールから AppSync の API の作成,DynamoDB へのデータ登録,検索をさらう
AWS CDK で AppSync や関連サービスの作成
Amplify のサンプルアプリと AppSync に接続したり,認証をつけたり AWS WAF を挟んだり等のハンズオン
AppSync のデータソースに Lambda を使うアーキテクチャの構成
X-Ray,CloudWatch Logs を有効化して AppSync でのモニタリングとロギング

ワークショップを通じて学べると感じたこと

マネジメントコンソールから API 作成

初めて AppSync に触る人にとってはチュートリアルパートで,勉強になります.API の作成,スキーマの作成,クエリを発行して DynamoDB のテーブルデータの中身を確認したり,スキーマを変更した場合にマッピングテンプレートを更新などといったハンズオンを行います.

CDK で AppSync を作成

マネジメントコンソールで API を作った後,次は CDK で AppSync の API を別で作っていきます.AppSync の API に curl でアクセスしてみることもやりました.コンソールからのアクセスのときは画面上でいじった時,開発時はどういう感じで動作確認を行うのかをイメージしたかったので参考になりました.

curl -s -XPOST -H "Content-Type:application/graphql" -H "x-api-key:$API_KEY" -d '{"query": "'"$MUTATION"'","variables": '$VARIABLES'}' $API_URL | jq
{
  "data": {
    "createDataPoint": {
      "createdAt": "2022-02-12T13:57:51.023Z",
      "name": "hello-world",
      "value": 94
    }
  }
}

$ curl -s -XPOST -H "Content-Type:application/graphql" -H "x-api-key:$API_KEY" -d '{"query": "'"$QUERY"'","variables": '$VARIABLES'}' $API_URL | jq
{
  "data": {
    "queryDataPointsByNameAndDateTime": {
      "items": [
        {
          "createdAt": "2022-02-12T13:57:51.023Z",
          "name": "hello-world",
          "value": 94
        }
      ]
    }
  }
}

Amplify のサンプルアプリケーションと AppSync や関連サービスとの連携ハンズオン

サンプルアプリケーションのコードに CDK で作った AppSync の情報を記載してローカルで起動すると下記の画像のアプリケーション画面が閲覧できます.ブラウザから AppSync API へのデータ生成を自動で行えて,そのデータを閲覧もできます.

初期画面 f:id:sadayoshi_tada:20220213164141p:plain

また,AppSync の API にアクセスしたデータを画面上に表示されます.また,Cognito を入れて認証画面を設けたり,データソースの DynamoDB へのアクセス制御は認証したユーザーのみにしたり,AWS WAF を挟んで自分の使っているグローバル IP からしか API アクセスを許可しないといったセキュリティを高めるオプションを学びました.

認証画面 f:id:sadayoshi_tada:20220213165945p:plain

WAF の有効化後の画面 f:id:sadayoshi_tada:20220213230358p:plain

AppSync のデータソースに Lambda を使うアーキテクチャの構成

AppSync のデータソースに Lambda を設定するアーキテクチャを構成するパートでは,これまでは DynamoDB に AppSync から操作を行っていたところを Lambda を介してクエリ発行するように構成していきます.1つ目が Direct Lambda Resolver という手法で,Lambda を間に挟むことで VTL マッピングテンプレートを使わずに,リクエスト情報を Lambda に渡して,Lmabda がレスポンスを GraphQL 形式に合わして整形し返却します.2つ目が Pipeline Resolver という手法で,複数のリゾルバを束ねてオペレーションを順番に実行できるといったものをハンズオンで学んでいきます.