S3 + CloudFront構成のSPAでWAFによるブロックが効かないときの解決策

ARANK

はじめに SREチームの森原(@daichi_morihara)です。今後は積極的に発信していこうという誓いを込めてXのアカウントを作成しました。 今回はEC2+ALBでホストしていたフロントエンドをS3+CloudFrontに移行する際に起きた問題について紹介しようと思います。移行後のフロントエンドのインフラ構成としては下の図の通りで、S3の前段にCloudFrontを配置しており、CloudFrontに紐づいたWAFがアクセス制限を行います。 フロントエンドのインフラ構成図 ここでハマった問題というのが「CloudFrontに紐づいたWAFが、なぜかブロックすべきアクセスまで通してしまう……