S3のWebホスティングでリダイレクト処理を入れてみた

みなさんこんにちは。 Apple Siliconに置き換わったiMacがいつ発売されるのかウキウキしている構築担当の川合です。

今回は、自分自身あまり利用した事がなかったS3のリダイレクトを触ってみたお話です。 静的Webサイトホスティングを有効にして、簡単に動作周りを確認していきたいと思います。

概要

動作検証のために、S3のバケットを新規で作成して静的Webサイトホスティングを有効にします。 外部からアクセス可能なように、バケットポリシーを含めパブリックアクセスを許可しておきます。

リダイレクト処理については、今回作成するバケットに対して適用を行います。 ※オブジェクト毎にメタデータを埋め込む方式は今回は利用しません

導入する処理としては、【wp】というフォルダ配下へのアクセスを【blog】に転送する処理を導入します。

設定作業

まずはバケットを作成します。

この段階でパブリックアクセスは有効化しておきます。

設定内容が問題なければ、バケットを作成します。

バケットの作成が完了したら、静的Webサイトホスティングを有効化します。 ※この段階では、リダイレクト処理はまだ導入しません。 コンテンツデータをアップロードしてから、改めて設定を導入します

インデックスとエラードキュメントは設定しておきます。

有効化できれば、バケットホスティングのチェックマークがつきます。

対象のバケット以下に、getobjectの処理を入れてバケットポリシーでも許可します

S3のディレクトリ構成はこんな感じ。

では、リダイレクト処理を導入してみます。

    <RoutingRule>
    <Condition>
      <KeyPrefixEquals>wp/</KeyPrefixEquals>
    </Condition>
    <Redirect>
      <ReplaceKeyPrefixWith>blog/</ReplaceKeyPrefixWith>
    </Redirect>
  </RoutingRule>
</RoutingRules>

内容としては、wp配下にアクセスがあるとblogにリダイレクトする内容になります。 では、実際にリダイレクトされるのかどうか確認したいと思います。

curl -I http://バケット名.s3-website-ap-northeast-1.amazonaws.com/wp/blog.html

HTTP/1.1 301 Moved Permanently
x-amz-id-2: FcZSxhv3w92EuIwVm8i/ddQhS2O1EGPycW18XFFcAX2m+CdpzE6iXhc9rv0yDpUyl0GZypa1yIg=
x-amz-request-id: CSBJAYEW4ZAT6P2M
Date: Tue, 23 Jun 2020 06:01:01 GMT
Location: http://バケット名.s3-website-ap-northeast-1.amazonaws.com/blog/blog.html
Content-Length: 0
Server: AmazonS3

wp配下のblog.htmlへのアクセスが、blog配下のblog.htmlにリダイレクトされていることがわかります。

ちなみに注意点としては、バケットにあるオブジェクトにアクセスするURLとWebホスティングでアクセスするURLは異なるので注意が必要です。 今回だと、

http://バケット名.s3-ap-northeast-1.amazonaws.com/wp/blog.html

http://バケット名.s3-website-ap-northeast-1.amazonaws.com/wp/blog.html

Webホスティングの方には、website という文言が入ります。 途中で勘違いをしていて、何故かリダイレクトしないなぁと思っていたらオブジェクトのURLで動作確認していたというオチでした。

まとめ

S3のWebホスティングでもリダイレクト処理を入れることが出来ますよというお話でした。 S3でのリダイレクト処理は使ったことがなかったので、簡単な静的ページとかならこの機能を使えばサイト構造が変わってもちゃんと引き継げるので便利だなと思いました。 今だと、サイト自体をSSL対応にしないといけなかったりするので単体ではSSLが使えないS3のWebホスティングですがCloudFrontと組み合わせて使えばSSL対応のサイトを安価で用意出来るので試しに使ってみるかなと思いました。