本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。
# 教學課程：建立基本 Lambda@Edge 函數 (主控台)
本教學課程將為您示範如何開始使用 Lambda@Edge，協助您建立及設定在 CloudFront 中執行的 Node.js 函數範例。此項範例會在 CloudFront 檢索檔案時，將 HTTP 安全性標頭新增到回應。(這可以改善網站的安全性和隱私。)
本教學課程不需要您自己的網站。不過您建立自己的 Lambda@Edge 解決方案時，會依照類似的步驟進行，並從相同的選項中選擇。
**Topics**
+ [步驟 1：註冊 AWS 帳戶](#lambda-edge-how-it-works-tutorial-AWS)
+ [步驟 2：建立 CloudFront 分佈](#lambda-edge-how-it-works-tutorial-cloudfront)
+ [步驟 3：建立函數](#lambda-edge-how-it-works-tutorial-create-function)
+ [步驟 4：新增一個 CloudFront 觸發條件來執行該函數](#lambda-edge-how-it-works-tutorial-add-trigger)
+ [步驟 5：驗證函數正常執行](#lambda-edge-how-it-works-tutorial-verify)
+ [步驟 6：排除問題](#lambda-edge-how-it-works-tutorial-troubleshoot)
+ [步驟 7：清除範例資源](#lambda-edge-how-it-works-tutorial-cleanup-resources)
+ [相關資訊](#lambda-edge-how-it-works-tutorial-resources)
## 步驟 1：註冊 AWS 帳戶
若您尚未註冊，請先註冊 AWS 帳戶。如需詳細資訊，請參閱[註冊 AWS 帳戶](setting-up-cloudfront.md#sign-up-for-aws)。
## 步驟 2：建立 CloudFront 分佈
在建立 Lambda@Edge 範例函數之前，您必須有一個可使用、包含提供內容之來源的 CloudFront 環境。
在此範例中，您會建立 CloudFront 分佈，此分佈是使用 Amazon S3 儲存貯體做為分佈的原始伺服器。如果您已有環境可使用，可以略過此步驟。
**使用 Amazon S3 原始伺服器建立 CloudFront 分佈**
1. 使用一兩個檔案來建立 Amazon S3 儲存貯體，例如範例內容適用的映像檔案。如需說明，請遵循[將您的內容上傳到 Amazon S3](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/GettingStarted.html#GettingStartedUploadContent) 中的步驟。請確定您有設定對應的許可，以授予儲存貯體中物件的公有讀取權限。
1. 請依照[建立 CloudFront Web 分佈](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/GettingStarted.html#GettingStartedCreateDistribution)中的步驟來建立 CloudFront 分佈，並新增您的 S3 儲存貯體當做原始伺服器。如果您已有分佈，可以改為新增儲存貯體當做該分佈的來源。
**提示**
請記下您的分佈 ID。稍後您在本教學課程中為函數新增 CloudFront 觸發條件時，您必須在下拉式清單中選擇分佈的 ID，例如 `E653W22221KDDL`。
## 步驟 3：建立函數
在這個步驟中，您將從 Lambda 主控台提供的藍圖範本開始建立 Lambda 函數。此函數會新增程式碼來更新您的 CloudFront 分佈中的安全標頭。
**建立 Lambda 函數**
1. 登入 AWS 管理主控台 並開啟位於 的 AWS Lambda 主控台[https://console.aws.amazon.com/lambda/](https://console.aws.amazon.com/lambda/)。
**重要**
請確定您位於美國**US-East-1（維吉尼亞北部） ** AWS 區域 (**us-east-1**)。您必須位在此區域，才能建立 Lambda@Edge 函數。
1. 選擇 **Create function (建立函數)**。
1. 在**建立函數**頁面上，選擇**使用藍圖**，然後在搜尋欄位中輸入 **cloudfront** 以篩選 CloudFront 藍圖。
**注意**
CloudFront 藍圖僅適用於**美國東部 1 (維吉尼亞北部)** 區域 (**us-east-1**)。
1. 選擇**修改 HTTP 回應標頭**藍圖做為函數的範本。
1. 輸入以下有關函數的資訊：
+ **函數名稱**：輸入函數的名稱。
+ **執行角色**：選擇如何為函數設定許可權限。若要使用建議的基本 Lambda@Edge 許可政策範本，請選擇**從 AWS 政策範本建立新角色**。
+ **角色名稱**：輸入政策範本建立的角色名稱。
+ **政策範本**：Lambda 會自動新增**基本 Lambda@Edge 許可權限**政策範本，因為您選擇 CloudFront 藍圖做為您的函數基礎。此原則範本會新增執行角色許可，讓 CloudFront 能夠在全球的 CloudFront 位置為您執行 Lambda 函數。如需詳細資訊，請參閱[設定 Lambda@Edge 的 IAM 許可權限和角色](lambda-edge-permissions.md)。
1. 請在頁面底部選擇**建立函數**。
1. 在顯示的**部署至 Lambda@Edge** 窗格中選擇**取消**。(在本教學課程中，您必須先修改函數程式碼，才能將函數部署至 Lambda@Edge。)
1. 向下捲動至頁面的**程式碼來源**區段。
1. 使用修改原始伺服器傳回之安全性標頭的函數，來取代範本程式碼。例如，您可能會使用與下列類似的程式碼：
```
'use strict';
export const 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);
};
```
1. 選擇**檔案**，然後選擇**儲存**以儲存更新後的程式碼。
1. 選擇**部署**。
繼續依照下一節的步驟，新增 CloudFront 觸發條件以執行函數。
## 步驟 4：新增一個 CloudFront 觸發條件來執行該函數
既然您已擁有用來更新安全標頭的 Lambda 函數，您可以設定 CloudFront 觸發條件來執行函數，在 CloudFront 從您的分佈原始伺服器收到的任何回應中新增標頭。
**設定函數的 CloudFront 觸發條件**
1. 在 Lambda 主控台頁面的**函數概覽**頁面中，選擇**新增觸發條件**。
1. 針對**觸發組態**選擇 **CloudFront**。
1. 選擇**部署到 Lambda@Edge**。
1. 在**部署到 Lambda@Edge** 面板中，在**設定 CloudFront 觸發條件**下輸入以下資訊：
+ **分佈**：要與函數建立關聯的 CloudFront 分佈 ID。在下拉式清單中選擇分佈 ID。
+ **快取行為**：要用於觸發條件的快取行為。在此範例中，請將值的設定保留為 **\$1**，這代表分佈的預設快取行為。如需詳細資訊，請參閱 [所有分佈設定參考](distribution-web-values-specify.md) 主題中的 [快取行為設定](DownloadDistValuesCacheBehavior.md)。
+ **CloudFront 事件**：指定函數何時執行的觸發條件。我們希望每當 CloudFront 從原始伺服器傳回回應時，都會執行安全標頭函數。因此請在下拉式清單中選擇**原始伺服器回應**。如需詳細資訊，請參閱[為 Lambda@Edge 函數新增觸發條件](lambda-edge-add-triggers.md)。
1. 選取**確認部署到 Lambda@Edge** 核取方塊。
1. 選擇**部署**以新增觸發條件，並將函數複寫至全球 AWS 位置。
1. 請等候函數完成複寫。這通常需要幾分鐘的時間。
若要檢查複寫是否已完成，請[移至 CloudFront主控台](https://console.aws.amazon.com/cloudfront/v4/home)並檢視您的分佈。等待分佈的狀態是否已從**正在部署**變為日期和時間 (表示您的函數已複寫完成)。若要驗證函數是否可正常運作，請依照下一節的步驟進行。
## 步驟 5：驗證函數正常執行
既然您已建立 Lambda 函數並設定觸發條件來為 CloudFront 分佈執行該函數，接下來請進行檢查，以確定函數會如預期執行。在此範例中，我們會檢查 CloudFront 傳回的 HTTP 標頭，以確認安全標頭已新增。
**驗證您的 Lambda@Edge 函數有新增安全標頭**
1. 在瀏覽器中，輸入 S3 儲存貯體中某個檔案的 URL。例如，您可以使用類似以下的 URL：`https://d111111abcdef8.cloudfront.net/image.jpg`。
如需用於檔案 URL 中 CloudFront 網域名稱的詳細資訊，請參閱[自訂 CloudFront 中檔案的 URL 格式](LinkFormat.md)。
1. 開啟瀏覽器的網頁開發人員工具列。例如，在 Chrome 瀏覽器視窗中，開啟內容 (按一下滑鼠右鍵) 選單，然後選擇 **Inspect (檢查)**。
1. 選擇 **Network (網路)** 索引標籤。
1. 重新載入頁面來查看您的影像，然後選擇左窗格中的 HTTP 請求。您會看到 HTTP 標頭顯示在個別的窗格中。
1. 查看 HTTP 標頭清單，以驗證預期的安全標頭包含在清單中。例如，您可能會看到類似於以下螢幕擷取畫面所示的標頭。
![\[HTTP 標頭清單，所要的安全標頭已採用突出顯示。\]](http://docs.aws.amazon.com/zh_tw/AmazonCloudFront/latest/DeveloperGuide/images/lambda-at-edge-security-headers-list.png)
如果安全標頭包含在您的標頭清單中，那就太棒了！這表示您已成功建立第一個 Lambda@Edge 函數。如果 CloudFront 傳回錯誤或有其他問題，請繼續下一個步驟來排除問題。
## 步驟 6：排除問題
如果 CloudFront 傳回錯誤或是未依照預期來新增安全標頭，您可以查看 CloudWatch Logs 來調查函數的執行狀況。請務必使用存放在最 AWS 接近執行函數之位置的日誌。
例如，如果您從倫敦檢視檔案，請試著在 CloudWatch 主控台將區域變更為歐洲 (倫敦)。
**檢查您 Lambda@Edge 函數的 CloudWatch Logs**
1. 登入 AWS 管理主控台 ，並在 https：//[https://console.aws.amazon.com/cloudwatch/](https://console.aws.amazon.com/cloudwatch/) 開啟 CloudWatch 主控台。
1. 將 **Region (區域)** 變更為您在瀏覽器中檢視檔案時所顯示的位置。這是函數執行所在的位置。
1. 在左窗格中，選擇 **Logs (日誌)** 來檢視分佈的日誌。
如需詳細資訊，請參閱[使用 Amazon CloudWatch 監控 CloudFront 指標](monitoring-using-cloudwatch.md)。
## 步驟 7：清除範例資源
如果您僅為本教學課程建立 Amazon S3 儲存貯體和 CloudFront 分佈，請刪除您配置 AWS 的資源，以免再產生費用。刪除 AWS 資源後，您新增的任何內容將無法再使用。
**工作**
+ [刪除 S3 儲存貯體](#lambda-edge-how-it-works-tutorial-delete-bucket)
+ [刪除 Lambda 函式](#lambda-edge-how-it-works-tutorial-delete-function)
+ [刪除 CloudFront 分佈](#lambda-edge-how-it-works-tutorial-delete-distribution)
### 刪除 S3 儲存貯體
刪除 Amazon S3 儲存貯體之前，請務必停用儲存貯體的記錄。否則，在刪除日誌時， AWS 請繼續將日誌寫入您的儲存貯體。
**停用儲存貯體的記錄**
1. 在以下網址開啟 Amazon S3 主控台：[https://console.aws.amazon.com/s3/](https://console.aws.amazon.com/s3/)。
1. 選取您的儲存貯體，然後選擇 **Properties (屬性)**。
1. 從 **Properties (屬性)** 選擇 **Logging (記錄日誌)**。
1. 清除 **Enabled (已啟用)** 核取方塊。
1. 選擇 **Save** (儲存)。
現在即可刪除儲存貯體。如需詳細資訊，請參閱 *Amazon Simple Storage Service 主控台使用者指南*中的[我該如何刪除 S3 儲存貯體？](https://docs.aws.amazon.com/AmazonS3/latest/userguide/delete-bucket.html)。
### 刪除 Lambda 函式
如需刪除 Lambda 函數關聯和函數本身 (選用) 的說明，請參閱 [刪除 Lambda@Edge 函數和複本](lambda-edge-delete-replicas.md)。
### 刪除 CloudFront 分佈
刪除 CloudFront 分佈前必須先將其停用。已停用的分佈如此即不再有用，也不會產生費用。您隨時都可以啟用之前停用的分佈。刪除停用的分佈之後，它即不再可供使用。
**停用和刪除 CloudFront 分佈**
1. 在 [https://console.aws.amazon.com/cloudfront/v4/home](https://console.aws.amazon.com/cloudfront/v4/home) 開啟 CloudFront 主控台。
1. 選取您要停用的分佈，然後選擇 **Disable (停用)**。
1. 出現確認提示時，請選擇 **Yes, Disable (是，停用)**。
1. 選取已停用的分佈，然後選擇 **Delete (刪除)**。
1. 出現確認提示時，選擇 **Yes, Delete (是，刪除)**。
## 相關資訊
現在您對於 Lambda@Edge 函數的運作方式已有了基本了解，請閱讀以下內容來進一步了解：
+ [Lambda@Edge 範例函數](lambda-examples.md)
+ [Lambda@Edge 設計最佳實務](https://aws.amazon.com/blogs/networking-and-content-delivery/lambdaedge-design-best-practices/)
+ [使用 Lambda@Edge 減少延遲並轉移運算至邊緣](https://aws.amazon.com/blogs/networking-and-content-delivery/reducing-latency-and-shifting-compute-to-the-edge-with-lambdaedge/)