チュートリアル: シンプルな Lambda@Edge 関数の作成 - Amazon CloudFront

チュートリアル: シンプルな Lambda@Edge 関数の作成

このチュートリアルでは、CloudFront で実行されるサンプル Node.js 関数を作成および追加する支援を行うことで、Lambda@Edge の使用を開始する方法を示します。説明するこの例では、HTTP セキュリティヘッダーをレスポンスに追加します。これにより、ウェブサイトのセキュリティとプライバシーが向上します このチュートリアルにはウェブサイトは必要ありません。この中で、CloudFront がファイルを取得するときに、セキュリティヘッダーをレスポンスに追加するだけです。

この例では、Lambda@Edge 関数を作成して設定するステップについて説明します。独自の Lambda@Edge ソリューションを作成するとき、同様のステップに従って同じオプションから選択できます。

ステップ 1: AWS アカウント にサインアップする

まだ Amazon Web Services にサインアップしていない場合は、https://aws.amazon.com/ からサインアップします。[今すぐ申し込む] を選択し、必須事項を入力します。

ステップ 2: CloudFront ディストリビューションを作成する

Lambda@Edge 関数の例を作成する前に、コンテンツの提供元のオリジンを含む、操作対象の CloudFront 環境が必要です。

CloudFront を初めて利用する場合 CloudFront は、エッジロケーションの世界的ネットワークを経由してコンテンツを配信します。CloudFront で Lambda 関数を設定すると、この関数はビューワーに近いコンテンツをカスタマイズし、パフォーマンスを向上させることができます。CloudFront に精通していない場合は、チュートリアルを完了する前に数分の時間をかけて、短い概要を読みCloudFront がコンテンツをキャッシュして提供する方法を理解してください。

この例では、Amazon S3 バケットをディストリビューションのオリジンとして使用する CloudFront ディストリビューションを作成します。使用する環境が既にある場合、このステップは省略できます。

Amazon S3 オリジンを使用して CloudFront ディストリビューションを作成するには
  1. サンプルコンテンツ用に、イメージファイルなど 1~2 つのファイルで Amazon S3 バケットを作成します。そのためには、コンテンツを Amazon S3 にアップロードするステップに従います。必ず、バケットのオブジェクトへのパブリック読み取りアクセス権を付与するアクセス許可を設定します。

  2. CloudFront ウェブディストリビューションを作成するステップに従って、CloudFront ディストリビューションを作成し、オリジンとして S3 バケットを追加します。ディストリビューションが既にある場合は、代わりにそのディストリビューションのオリジンとしてバケットを追加できます。

    ヒント

    ディストリビューション ID をメモします。このチュートリアルの後半では、関数の CloudFront トリガーを追加するときに、ドロップダウンリストでディストリビューションの ID を選択する必要があります (例: E653W22221KDDL)。

ステップ 3: 関数を作成する

このステップでは、Lambda 関数を作成し、Lambda コンソールで提供される設計図テンプレートで開始します。関数コードは、CloudFront ディストリビューションでセキュリティヘッダーを更新するコードを追加します。

Lambda または Lambda@Edge を始めて利用する場合 Lambda@Edge では、CloudFront トリガーを使用して Lambda 関数を呼び出すことができます。CloudFront ディストリビューションを Lambda 関数に関連付けると、CloudFront エッジロケーションでリクエストとレスポンスがインターセプトされ、関数が実行されます。Lambda 関数はセキュリティを向上させたり、ビューワーに近い情報をカスタマイズして、パフォーマンスを向上させたりできます。このチュートリアルでは、作成する関数で、CloudFront レスポンスのセキュリティヘッダーを更新します。

Lambda 関数を作成するときに、実行する複数のステップがあります。このチュートリアルでは、設計図テンプレートを関数の基礎として使用し、セキュリティヘッダーを設定するコードで関数を更新します。最後に、関数を実行する CloudFront トリガーを追加およびデプロイします。

Lambda 関数を作成するには
  1. AWS Management Console にサインインして、AWS Lambda で https://console.aws.amazon.com/lambda/ コンソールを開きます。

    重要

    US-East-1 (バージニア北部) リージョン (us-east-1) にいることを確認します。Lambda@Edge 関数を作成するには、このリージョンに設定されている必要があります。

  2. [機能の作成]を選択します。

  3. [関数の作成] ページで、[設計図の使用] を選択し、各フィールドに「cloudfront」と入力して CloudFront の設計図をフィルタリングします。[キーワード: cloudfront] が表示され、CloudFront のタグが付けられたすべての設計図が表示されます。

    注記

    CloudFront の設計図は、US-East-1 (バージニア北部) リージョン (us-east-1) でのみ使用できます。

  4. 関数のテンプレートとして [cloudfront-modify-response-header] 設計図を選択します。

  5. 関数に関する次の情報を入力します。

    名前

    関数の名前を入力します。

    実行ロール

    関数のアクセス許可を設定する方法を選択します。推奨される基本 Lambda@Edge アクセス許可ポリシーテンプレートを使用するには、[AWS ポリシーテンプレートから新しいロールを作成する] を選択します。

    ロール名

    ポリシーテンプレートが作成するロールの名前を入力します。

    ポリシーテンプレート

    関数の基礎として CloudFront の設計図を選択したため、Lambda によりポリシーテンプレート [基本エッジ Lambda のアクセス許可] が自動的に追加されます。このポリシーテンプレートでは、世界中の CloudFront の場所で、Lambda 関数の実行を CloudFront に許可する実行ロールアクセス許可を追加します。詳細については、「Lambda@Edge 用の IAM アクセス権限とロールの設定」を参照してください。

  6. [機能の作成]を選択します。Lambda により関数が作成され、次のページに関数の設定が表示されます。

  7. ページの [デザイナー] セクションで、次の図に示すように関数名を選択します。この例では、関数名は ExampleFunction です。

    
								Lambda コンソールの Lambda 関数ページ。関数名が選択されたデザイナーセクションが表示されています。
  8. 次の図に示すように、ページの [関数コード] セクションまで下にスクロールします。

    
								Lambda コンソールの Lambda 関数ページ。関数コードセクションが表示されています。

    テンプレートコードを、オリジンが返すセキュリティヘッダーを変更する関数に置き換えます。たとえば、以下のようなコードを実行できます。

    'use strict'; exports.handler = (event, context, callback) => { //Get contents of response const response = event.Records[0].cf.response; const headers = response.headers; //Set new headers headers['strict-transport-security'] = [{key: 'Strict-Transport-Security', value: 'max-age= 63072000; includeSubdomains; preload'}]; headers['content-security-policy'] = [{key: 'Content-Security-Policy', value: "default-src 'none'; img-src 'self'; script-src 'self'; style-src 'self'; object-src 'none'"}]; headers['x-content-type-options'] = [{key: 'X-Content-Type-Options', value: 'nosniff'}]; headers['x-frame-options'] = [{key: 'X-Frame-Options', value: 'DENY'}]; headers['x-xss-protection'] = [{key: 'X-XSS-Protection', value: '1; mode=block'}]; headers['referrer-policy'] = [{key: 'Referrer-Policy', value: 'same-origin'}]; //Return modified response callback(null, response); };
  9. 更新されたコードを保存するには、[保存] を選択します。

次のセクションに進み、関数を実行する CloudFront トリガーを追加します。

ステップ 4: 関数を実行する CloudFront トリガーを追加する

これでセキュリティヘッダーを更新する Lambda 関数ができたので、CloudFront がディストリビューションのオリジンから受け取ったヘッダーをレスポンスに追加するように、関数を実行する CloudFront トリガーを設定します。

関数の CloudFront トリガーを設定するには
  1. ページの [デザイナー] セクションで、次の図に示すように [CloudFront] を選択します。

    
								Lambda コンソールの Lambda 関数ページ。CloudFront が選択されているデザイナーセクションが表示されています。
  2. ページの [トリガーの設定] セクションまで下にスクロールし、[Lambda@Edge にデプロイ] を選択します。

  3. [Lambda@Edge へのデプロイ] ページの [CloudFront トリガーの設定] に、次の情報を入力します。

    配信

    関数に関連付ける CloudFront ディストリビューション ID。ドロップダウンリストで、ディストリビューション ID を選択します。

    キャッシュ動作

    トリガーで使用するキャッシュ動作。この例では、値を * に設定したままにします。これは、ディストリビューションのデフォルトのキャッシュ動作を意味します。詳細については、「ディストリビューションを作成または更新する場合に指定する値」トピックの「キャッシュ動作の設定」を参照してください。

    CloudFront イベント

    関数をいつ実行するか指定するトリガー。CloudFront がオリジンからレスポンスを返すたびに、セキュリティヘッダー関数を実行したいと思います。したがって、ドロップダウンリストで [Origin response (オリジンのレスポンス)] を選択します。詳細については、「Lambda@Edge 関数のトリガーの追加」を参照してください。

  4. [Lambda@Edge へのデプロイを確認] で、このチェックボックスをオンにして、トリガーがデプロイされていることを確認し、AWS のすべての場所で関数を実行します。

  5. [デプロイ] を選択して、トリガーを追加し、世界中の AWS の場所に関数をレプリケートします。次に、必要に応じて [Lambda@Edge にデプロイ] ページを閉じます。

  6. 関数がレプリケートするまで待ちます。これには通常数分かかります。

    レプリケーションが終了したかどうかを確認するには、CloudFront コンソールに移動し、ディストリビューションを表示します。ディストリビューションのステータスが [進行中] から [デプロイ済み] に戻るまで待ちます。この場合、関数はレプリケートされたことを意味します。関数が機能することを確認するには、次のセクションのステップに従います。

ステップ 5: 関数の実行を確認する

Lambda 関数を作成し、CloudFront ディストリビューションに対してその関数を実行するトリガーが設定されたため、関数が正常に動作することを確認します。この例では、CloudFront が返す HTTP ヘッダーで、セキュリティヘッダーが追加されることを確認します。

Lambda@Edge 関数でセキュリティヘッダーが追加されることを確認するには
  1. ブラウザで、S3 バケット内のファイルの URL を入力します。たとえば、https://d111111abcdef8.cloudfront.net/image.jpg のような URL を使用できます。

    ファイル URL で使用する CloudFront ドメイン名の詳細については、「CloudFront でファイルの URL の形式をカスタマイズする」を参照してください。

  2. ブラウザのウェブデベロッパーツールバーを開きます。たとえば、Chrome のブラウザウィンドウで、コンテキスト(右クリック)メニューを開き、[Inspect (調査)] を選択します。

  3. [Network (ネットワーク)] タブを選択します。

  4. ページを再ロードしてイメージを表示し、左側のペインの HTTP リクエストを選択します。HTTP ヘッダーが別のペインに表示されます。

  5. HTTP ヘッダーのリストを確認し、予期されるセキュリティヘッダーがリストに含まれていることを確認します。たとえば、次のスクリーンショットに示すようなヘッダーが表示されます。

    
								予想されるセキュリティヘッダーがハイライト表示された HTTP ヘッダーのリスト。

セキュリティヘッダーがヘッダーのリストに含まれていれば、成功です。最初の Lambda@Edge 関数を正常に作成しました。CloudFront がエラーを返す場合や、その他の問題がある場合は、次のステップに進んで問題のトラブルシューティングを行います。

ステップ 6: 問題のトラブルシューティングを行う

CloudFront がエラーを返すか、予期どおりにセキュリティヘッダーを追加しない場合は、CloudWatch Logs を参照して関数の実行を調査できます。必ず、関数が実行された場所に最も近い AWS ロケーションで保存されたログを使用します。

例えば、ロンドンからファイルを表示する場合は、CloudWatch コンソールでリージョンを欧州 (ロンドン) に変更してみてください。

Lambda@Edge 関数の CloudWatch Logs を調べるには
  1. AWS Management Console にサインインして、CloudWatch コンソール (https://console.aws.amazon.com/cloudwatch/) を開きます。

  2. [リージョン] を、ブラウザでファイルを表示したときに表示されるロケーションに変更します。これは、関数が実行されている場所です。

  3. 左側のペインで、[ログ] を選択して、ディストリビューションのログを表示します。

詳細については、「Amazon CloudWatch による CloudFront メトリクスのモニタリング」を参照してください。

ステップ 7: リソース例をクリーンアップする

このチュートリアルのためだけに Amazon S3 バケットと CloudFront ディストリビューションを作成した場合は、割り当てた AWS リソースを削除して、今後料金が発生しないようにしてください。AWS リソースを削除すると、追加したコンテンツは使用できなくなります。

[Tasks] (タスク)

S3 バケットの削除

Amazon S3 バケットを削除する前に、バケットのログ記録が無効であることを確認します。それ以外の場合、削除するバケットへのログの書き込みが AWS によって継続されます。

バケットのログ記録を無効にするには
  1. Amazon S3 コンソール (https://console.aws.amazon.com/s3/) を開きます。

  2. バケットを選択し、[プロパティ] を選択します。

  3. [プロパティ] から [ログ記録] を選択します。

  4. [有効] チェックボックスをオフにします。

  5. [Save] を選択します。

これで、バケットを削除できます。詳細については、Amazon Simple Storage Service コンソールユーザーガイドの「バケットの削除」を参照してください。

CloudFront ディストリビューションの削除

CloudFront ディストリビューションを削除する前に、ディストリビューションを無効にする必要があります。無効になったディストリビューションは機能しなくなり、料金も発生しません。無効にしたディストリビューションはいつでも有効にすることができます。無効にしたディストリビューションを削除すると、使用できなくなります。

CloudFront ディストリビューションを無効にして削除するには
  1. で CloudFront コンソールを開きますhttps://console.aws.amazon.com/cloudfront/v3/home

  2. 無効にするディストリビューションを選択してから [Disable (無効化)] を選択します。

  3. 確認を求められたら、[Yes, Disable (はい、無効化する)] を選択します。

  4. 無効にしたディストリビューションを選択してから [削除] を選択します。

  5. 確認を求めるメッセージが表示されたら、[Yes, Delete (はい、削除します)] を選択します。

その他のリソース

Lambda@Edge 関数の動作について基本的な理解を得たので、以下を参照してさらに詳しく学習します。