📝

[小ネタ] API Gateway の OPTIONS メソッドへのリクエストもメトリクスにカウントされる話

2025/02/03に公開

API Gateway で CORS を有効にした際に追加される OPTIONS メソッドへのリクエストが、API Gateway の Count メトリクスに記録されるという話です。

背景

CORS: OPTIONSリクエスト(preflight request)を避ける #JavaScript - Qiita

一度しかリクエストを送信していなくても、実際はOPTIONSとGETなど、2回リクエストが走っています。

上記記載から、API Gateway のメトリクスとしてもカウントされるかどうかが気になったのがきっかけです。

試してみた

nkm-m/Translate-App
上記アプリで試してみました。
API Gateway では CORS が有効になっており、ブラウザからは以下のコードで POST リクエストを送信しています。

index.js
function translateText() {
  const url = "{your-RestAPIEndpoint}"; // Replace this with RestAPIEndpoint
  const text = document.getElementById("japanese").value;
  axios
    .post(url, {
      text,
    })
    .then((res) => {
      document.getElementById("english").value = res.data;
    })
    .catch((error) => {
      document.getElementById("err").innerHTML = error;
    });
}

OPTIONS メソッドへのリクエスト結果

上記アプリをデプロイ後、CloudFront の URL へのアクセスで OPTIONS メソッドにアクセスしていることが確認できます。

API Gateway の実行ログにも OPTIONS メソッドへのアクセスが記録されていました。

(ce7cb457-fa3c-4d6b-ad22-ceacc96a0a49) HTTP Method: OPTIONS, Resource Path: /

POSt メソッドへのリクエスト結果

POST メソッドへのアクセスも確認できました。

(de31ff9e-8949-4a4d-80a4-fb582b9f1417) HTTP Method: POST, Resource Path: /

CloudWatch メトリクスの確認結果

以下の通り、Count メトリクスは 2 と記録されていました。

まとめ

今回は API Gateway の OPTIONS メソッドへのリクエストもメトリクスにカウントされる話を紹介しました。
どなたかの参考になれば幸いです。

参考資料

Discussion