Amplifyに念願のWAFが来ました！

# AmplifyにWAFが来たぞ！
Amplifyに念願のWAFが来ましたー！！

https://github.com/aws-amplify/amplify-hosting/issues/36

Amplifyといえば、簡単にフロントエンドからバックエンドまでをIaCで構築できるAWSサービスです。

その際、フロントエンドのデプロイにはCloudFront+S3が用いられるのですが、そのCloudFrontにWAFを設定することはできませんでした。

回避策として、Amplifyの前に置くCloudFrontを独自に作成し、CloudFrontにWAFを設定する必要がありました。
構成図にするとめちゃくちゃ歪な感じになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/a338600c-496e-9b5e-69f6-c03db7f73d09.png)

しかし、今回のアップデートによってこんな構成を組まなくて良くなります！
というところで設定画面を見ていきましょう！

# 設定画面
デプロイが開始されると…「ファイアウォール」の項目が見えました！！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/b55891d5-5aa2-c1fa-ab03-cbd6fe0a7b3a.png)

選択すると、こんな画面が表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/abb7194c-fc54-ee9c-6aae-cb4cd294a632.png)
***
上から見ていきましょう。
まずはWAFの保護を有効化するか否かの設定です。
その下にはamplifyapp.comへのアクセスを制限するかが決められるそうです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/de7fedb3-f7f0-93ae-68c0-d1f4b5b869c2.png)

前者はともかく、後者は画面上だけではちょっとよくわかりませんでした。
有効にしても画面上で追加設定が出てくるとかもなく…結局何をどう制限してくれるのかがわかりませんでした。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/18c78044-2c20-4e8b-f8cb-2bba9774cea8.png)

ただ、GitHub上のやり取りを見ていると、この設定について言及されていました。曰く、
「これは、カスタムドメインに変更したユーザーが、Amplifyのオリジナルのウェブサイト（例：https://xxx.yyyy.amplifyapp.com ）からのアクセスを制限したい場合のための機能だと思います。
私の場合は、この機能をオンにすることで、Googlebotがウェブサイトにアクセスして重複コンテンツとしてマークされることを防いでいます。」とのこと。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/d6ac902c-bbec-6b4c-861e-c1ced56c6fc5.png)

つまりどういうことかというと、Amplifyでホストしているウェブサイトに対して、**素の「amplifyapp.com」ドメインからのアクセスを防ぐ機能**です。

Amplifyはデプロイすると、デフォルトで「abcd1234.amplifyapp.com」のようなデフォルトドメイン名が割り当てられます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/3f9e999f-74da-4eb8-8dfc-31d03fe21800.png)

ただ、Amplifyではカスタムドメインを独自に設定することもできます。
ここでは、「**example.com**」とします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/0e6fdde4-27cd-9c3d-24eb-a3d6851a4f63.png)

この時、「amplifyapp.comへのアクセスを制限する」を有効にしておけば、<font color="red">**デフォルトドメインからのアクセスは制限され、カスタムドメインからのアクセスのみ可能**</font>になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/59340b4c-a1d6-8b15-d9cd-ce4d28590a20.png)

ということで、基本的にはONにしておくことになる設定ではないかなぁと思います！
***
続いて、具体的な制限のかけ方についてです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/b7dc2c58-e1e2-a1ac-24c1-791c21f538ad.png)

:::note warn
1つ注意点として、**IPアドレスと国の制限は同時に2つとも有効化することはできません**(2024年12月19日現在)。
どちらか1つずつだけが設定可能となっています。
:::

まずはIPアドレスの設定です。
個人的にはかなりシンプルな画面かつ設定が簡単で、非常に好印象でした。

WAFのIP setsが使えそうな雰囲気もあるのですが、ここにどうやって設定するかはちょっとわかりませんでした。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/a8c55a1f-ca67-f2ba-6eb7-cc93ce397d50.png)

国も似たような形で設定可能です。
国名はプルダウンの選択式(検索も可能)だったので、こちらも手軽に設定できそうです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/57bf0f3e-07ac-dbf7-744c-8d3a436d587b.png)

今回はIPアドレスを設定し、有効化してみました。

:::note warn
どうやらAmplify Firewallにはお金がかかるらしいです。
プレビュー中はWAFの使用料のみ、ということはGAされたらWAF+Amplify Firewallの二重課金が発生するかもしれない…？

ちょっと今後もチェックしておく必要がありそうですね。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/705f748d-d9ce-7805-939c-22d7f9f67a66.png)
:::

設定が完了すると、このような画面になります。
そして、きちんとWAFログも出力されるようです！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/ab1692c3-11ff-2163-1c1f-8b950270af87.png)

実際にWAFログを確認していきます。


どうやらAmplify Firewallを有効化すると、自動でWeb ACLsのRuleなどが作成されるようですね。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/5331e6a7-4fa9-1afa-871a-af69ec4cd587.png)

いくつかは自動でルールが設定されていましたが、先ほど設定したIPアドレス制限や、ドメイン制限もきちんと反映されていました！

IPAllowListでは、IP Setsも自動作成されていたので、追加で制限をかけたくなった場合はそこを編集すれば良さそうです！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/3872f9ba-06b0-21ce-041f-5b7023d6de2c.png)
↓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/bbc37e7f-3587-6023-33f8-3a1aa35606ac.png)

amplifyapp.comドメイン経由でのアクセスもきちんとブロックされていました！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3616210/41a116a1-15bc-2316-9c79-fe0a9b22aade.png)

# まとめ
ということで、念願のAmplify Firewall機能でした！
現状ですでに必須の機能は実装されているのではないでしょうか！

re:Invent期間中にはAmplify AI Kitなんかも実装されており、非常に勢いを増しているAmplify！
これからも継続してキャッチアップしていきます！