CloudFront + S3 で「This XML file does not appear to have any style information associated with it.」エラー

#はじめに

静的ファイルをS3に保存し、Cloudfront経由で公開しようとした際に、下記のエラーに出くわしました。

  <Code>SignatureDoesNotMatch</Code>
  <Message>The request signature we calculated does not match the signature you provided. Check your key and signing method.</Message>
  <AWSAccessKeyId>*******</AWSAccessKeyId>

#原因
結論から言うと、CloudFrontのオリジンリクエストのキャッシュキーにHostヘッダーを追加していたことが原因でした。
Hostヘッダーを追加すると、OriginにHostヘッダーが転送されます。

OriginにS3を設定した場合、S3バケットの特定にはHOSTヘッダーが使われます。
CloudFrontからS3へリクエストする際のHOSTヘッダーが、クライアントリクエストのHOSTヘッダーで上書きされてしまい、その結果として、S3バケットが見つからず、エラーになったというわけです。

他にもオリジンリクエストポリシーのAllViewerやヘッダーのAuthorizationが追加されると同様に上書きされてしまい、エラーになります。

同様に、CloudFront　→　ELB　→　EC2の構成の場合、
abcd.cloudfront.netでアクセスすると、同様のエラーが起きますね。