本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

# 當您從 F5 遷移到 AWS 上的 Application Load Balancer 時修改 HTTP 標頭
<a name="modify-http-headers-when-you-migrate-from-f5-to-an-application-load-balancer-on-aws"></a>

*Sachin Trivedi，Amazon Web Services*

## 總結
<a name="modify-http-headers-when-you-migrate-from-f5-to-an-application-load-balancer-on-aws-summary"></a>

當您將使用 F5 Load Balancer 的應用程式遷移至 Amazon Web Services (AWS)，並想要在 AWS 上使用 Application Load Balancer 時，遷移 F5 規則以進行標頭修改是常見的問題。Application Load Balancer 不支援標頭修改，但您可以使用 Amazon CloudFront 做為內容交付網路 (CDN) 和 Lambda@Edge 來修改標頭。

此模式說明必要的整合，並透過使用 AWS CloudFront 和 Lambda@Edge 提供標頭修改的範例程式碼。

## 先決條件和限制
<a name="modify-http-headers-when-you-migrate-from-f5-to-an-application-load-balancer-on-aws-prereqs"></a>

**先決條件**
+ 內部部署應用程式，使用 F5 負載平衡器搭配使用 取代 HTTP 標頭值的組態`if, else`。如需此組態的詳細資訊，請參閱 F5 產品文件中的 [HTTP：：header](https://clouddocs.f5.com/api/irules/HTTP__header.html)。 

**限制**
+ 此模式適用於 F5 負載平衡器標頭自訂。對於其他第三方負載平衡器，請檢查負載平衡器文件以取得支援資訊。
+ 您用於 Lambda@Edge 的 Lambda 函數必須位於美國東部 （維吉尼亞北部） 區域。

## Architecture
<a name="modify-http-headers-when-you-migrate-from-f5-to-an-application-load-balancer-on-aws-architecture"></a>

下圖顯示 AWS 上的架構，包括 CDN 和其他 AWS 元件之間的整合流程。

![使用 Amazon CloudFront 和 Lambda@Edge 修改標頭的架構](http://docs.aws.amazon.com/zh_tw/prescriptive-guidance/latest/patterns/images/pattern-img/00abbe3c-2453-4291-9b24-b488dced4868/images/4ee9a19e-6da2-4c5a-a8bc-19d3918a166e.png)


## 工具
<a name="modify-http-headers-when-you-migrate-from-f5-to-an-application-load-balancer-on-aws-tools"></a>

**AWS 服務**
+ [Application Load Balancer](https://docs.aws.amazon.com/elasticloadbalancing/latest/application/introduction.html) - Application Load Balancer 是一種 AWS 全受管負載平衡服務，可在開放系統互連 (OSI) 模型的第七層運作。它平衡多個目標的流量，並支援基於 HTTP 標頭和方法、查詢字串以及主機型或路徑型路由的進階路由請求。
+ [Amazon CloudFront](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Introduction.html) – Amazon CloudFront 是一種 Web 服務，可加速將靜態和動態 Web 內容，例如 .html、.css、.js 和映像檔案分發給使用者。CloudFront 透過稱為節點的全球資料中心網路提供內容，以降低延遲並改善效能。
+ [Lambda@Edge](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/lambda-at-the-edge.html) ─ Lambda@Edge 是 AWS Lambda 的延伸，可讓您執行函數來自訂 CloudFront 提供的內容。您可以在美國東部 （維吉尼亞北部） 區域中編寫函數，然後將函數與 CloudFront 分佈建立關聯，以在全球各地自動複寫程式碼，而無需佈建或管理伺服器。這可減少延遲並改善使用者體驗。

**Code**

下列範例程式碼提供修改 CloudFront 回應標頭的藍圖。遵循 *Epics* 區段中的指示來部署程式碼。

```
exports.handler = async (event, context) => {
    const response = event.Records[0].cf.response;
    const headers = response.headers;


    const headerNameSrc = 'content-security-policy';
    const headerNameValue = '*.xyz.com';


    if (headers[headerNameSrc.toLowerCase()]) {
        headers[headerNameSrc.toLowerCase()] = [{
            key: headerNameSrc,
            value: headerNameValue,
        }];
        console.log(`Response header "${headerNameSrc}" was set to ` +
                    `"${headers[headerNameSrc.toLowerCase()][0].value}"`);
    }
    else {
            headers[headerNameSrc.toLowerCase()] = [{
            key: headerNameSrc,
            value: headerNameValue,
            }];
    }
    return response;
};
```

## 史詩
<a name="modify-http-headers-when-you-migrate-from-f5-to-an-application-load-balancer-on-aws-epics"></a>

### 建立 CDN 分佈
<a name="create-a-cdn-distribution"></a>


| 任務 | Description | 所需的技能 | 
| --- | --- | --- | 
| 建立 CloudFront Web 分佈。 | 在此步驟中，您會建立 CloudFront 分佈，以告知 CloudFront 您要從何處交付內容，以及如何追蹤和管理內容交付的詳細資訊。<br />若要使用主控台建立分佈，請登入 AWS 管理主控台，開啟 [CloudFront 主控台](https://console.aws.amazon.com/cloudfront/v3/home)，然後遵循 [CloudFront 文件](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/distribution-web-creating-console.html)中的步驟。 | 雲端管理員 | 

### 建立和部署 Lambda@Edge 函數
<a name="create-and-deploy-the-lambda-edge-function"></a>


| 任務 | Description | 所需的技能 | 
| --- | --- | --- | 
| 建立和部署 Lambda@Edge 函數。 | 您可以使用修改 CloudFront 回應標頭的藍圖來建立 Lambda@Edge 函數。（其他 bluePrints 適用於不同的使用案例；如需詳細資訊，請參閱 CloudFront 文件中的 [Lambda@Edge 範例函數](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/lambda-examples.html)。) <br />若要建立 Lambda@Edge 函數：[See the AWS documentation website for more details](http://docs.aws.amazon.com/zh_tw/prescriptive-guidance/latest/patterns/modify-http-headers-when-you-migrate-from-f5-to-an-application-load-balancer-on-aws.html) | AWS 管理員 | 
| 部署 Lambda@Edge 函數。 | 遵循教學課程[的步驟 4](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/lambda-edge-how-it-works-tutorial.html#lambda-edge-how-it-works-tutorial-add-trigger)：在 Amazon CloudFront 文件中建立簡單的 Lambda@Edge 函數，以設定 CloudFront 觸發並部署函數。 ** | AWS 管理員 | 

## 相關資源
<a name="modify-http-headers-when-you-migrate-from-f5-to-an-application-load-balancer-on-aws-resources"></a>

**CloudFront 文件**
+ [自訂原始伺服器的請求和回應行為](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/RequestAndResponseBehaviorCustomOrigin.html) 
+ [使用分佈](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/distribution-working-with.html) 
+ [Lambda@Edge 範例函數](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/lambda-examples.html) 
+ [使用 Lambda@Edge 在邊緣自訂](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/lambda-at-the-edge.html)
+ [教學課程：建立簡單的 Lambda@Edge 函數](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/lambda-edge-how-it-works-tutorial.html)