背景

S3とCloudFrontで静的ウェブサイトホスティングをできることは知っていましたが、CloudFrontでそれ以外の機能について正直ほとんどさわったことがありませんでした。
下記ドキュメントを読んでいると、CloudFront Functions(関数)を利用することで、独自のコードを記述でき、 CloudFrontディストリビューションがリクエストに対するレスポンスをカスタマイズできると記載がありました。

ステータスコードの変更と本文の生成 — ヘッダーを評価し、カスタマイズされたコンテンツでビューワーに返すことができます。

URL リダイレクトまたは書き換え: リクエスト内の情報に基づいてビューワーを他のページにリダイレクトしたり、すべてのリクエストをあるパスから別のパスに書き換えたりできます。

CloudFront Functions(関数)を利用して、別のCloudFrontディストリビュージョンにリダイレクト設定することができましたので、備忘録的な形でブログに残しておきます。

CloudFront Functions(関数)をまだ利用したことない人などの参考になれば幸いです。

 

前提

変更前にそれぞれのディストリビュージョンにアクセスすると以下のように表示されます。
CloudFrontディストリビュージョン①にアクセスした場合、『Hello world』
CloudFrontディストリビュージョン②にアクセスした場合、『Redirect is successful』

CloudFront Functions(関数)を利用して、CloudFrontディストリビュージョン①にアクセスした場合も
リダイレクトされて、『Redirect is successful』と表示されるように関数を作っていきます。

※今回は関数の作成がメインのため、S3とCloudFrontの構築は省略し、CloudFront Functions(関数)のみにフォーカスしております。

 

作成手順

早速ですがCloudFront Functions(関数)を作成します。
AWSコンソールよりCloudFrontのメニューより『関数』をクリックし任意の名前を入力します。
今回は『Redirect-test』で作成いたします。

ページが転移したら『構築』項目に『関数コード』という欄がありますので、そちらにコードをペーストします。

実際に設定した関数はこちらです。
var redirectUrl にて、リダイレクト先のCloudFrontディストリビュージョンのURL『https://xxxxxxxxxxxxxxxx.cloudfront.net』を指定します。

function handler(event) {
    var request = event.request;
    var redirectUrl = 'https://xxxxxxxxxxxxxxxx.cloudfront.net' + request.uri;

    var response = {
        statusCode: 301,
        statusDescription: 'Moved Permanently',
        headers: {
            "location": { "value": redirectUrl }
        }
    };

    return response;
}

次に『発行』の項目より関数を発行します。

発行後、関数をCloudFrontディストリビュージョンに登録できる様になりますのでリダイレクト元のCloudfrontディストリビュージョンに登録します。

設定後にCloudFrontディストリビュージョン①にアクセスしたところ、想定通り『Redirect is successful』のページへリダイレクトされたことが確認できました。

CloudFront Functions(関数)は柔軟にアクセスのレスポンス設定などが行えるため、今後も色々な場面で使いそうです。
今回の様なリダイレクト設定は利用ケースとして少ないかもしれませんが、CloudFront Functions(関数)の取り掛かりにはちょうど良かったです。

 

参考記事