DVA-C02 練習問題 5

ある企業は、子会社の 1 つのためにクライアントサイドの Web アプリケーションを Amazon S3 でホストしています。この Web アプリケーションは https://www.example.com から Amazon CloudFront 経由でアクセスできます。展開が成功した後、同社は残りの子会社のためにさらに 3 つのクライアントサイド Web アプリケーションを、3 つの別々の S3 バケットでホストしたいと考えています。 この目標を達成するため、開発者は共通の JavaScript ファイルと Web フォントをすべて、Web アプリケーションに配信する中央 S3 バケットに移動しました。ところがテスト中に、ブラウザが JavaScript ファイルと Web フォントをブロックすることに開発者は気付きました。 ブラウザが JavaScript ファイルと Web フォントをブロックしないようにするには、開発者は何をすべきですか？

【正解】C

【0からの解説】
各 Web アプリは自分のオリジン（例: www.example.com）から配信されますが、共通の JavaScript や Web フォントは別オリジンの「中央 S3 バケット」から読み込みます。ブラウザには「同一オリジンポリシー」というセキュリティ機構があり、異なるオリジンからのリソース取得（特にフォントや一部のスクリプト読み込み）はサーバー側が明示的に許可しない限りブロックされます。
この許可を与える仕組みが CORS（クロスオリジンリソース共有）です。中央 S3 バケットに CORS 構成を追加し、各 Web アプリのオリジンからのアクセスを許可すれば、ブラウザはレスポンスの CORS ヘッダーを見てクロスオリジン読み込みを許可します。症状（クロスオリジンのブロック）と対策（CORS 設定）が直結する典型問題です。

【誤りの選択肢】
A：S3 アクセスポイントは大規模な共有データセットへのアクセス管理を簡素化する機能で、ブラウザのクロスオリジン制約とは無関係です。
B：バケットポリシーは S3 側の認可（誰がオブジェクトを取得できるか）を制御するもので、ブラウザの同一オリジンポリシーによるブロックは解決できません。アクセス可否ではなくブラウザのオリジン制御が問題なので的外れです。
D：Content-MD5 はデータ整合性（転送中の破損検出）のためのヘッダーで、クロスオリジン読み込みの許可とは全く関係ありません。

【参考】
Amazon S3 の CORS 設定