Amazon CloudFront 部署小指南（七）- 使用 CloudFront Function 模板加 EchoServer 进行快速调试

一. CloudFront Function 介绍

使用 Amazon CloudFront，您可以编写自己的代码来处理 HTTP 请求和响应。代码在您的用户附近运行以最大限度的减少延迟，并且您无需管理服务器或其他基础设施。您可编写代码来操纵流经 CloudFront 的请求和响应、执行基本身份验证和授权、在边缘生成 HTTP 响应等。您编写并附加到 CloudFront 分配的代码称为边缘函数。CloudFront 目前提供了两种编写和管理边缘函数的方法。

借助 CloudFront Functions，您可以使用 JavaScript 编写轻量级函数，以实现大规模、对延迟敏感的 CDN 自定义处理。 CloudFront Functions 运行时环境提供亚毫秒级启动时间，可立即扩展以每秒处理数百万个请求，并且高度安全。CloudFront Functions 是 CloudFront 的原生功能，这意味着您可以完全在 CloudFront 中构建、测试和部署代码。

有关 CloudFront Functions 更多介绍可以参阅 CloudFront 文档。

二. 适用场景介绍

在实际项目中，我们会经常使用 CloudFront Function 来处理请求中的 Header 信息，包括新增或者重写已有的标头。

比如缓存键归一化场景，通过转变 HTTP 请求属性（标头、查询字符串、cookies，甚至是 URL 路径）以创建最佳缓存键，来可以提高您的缓存命中率；再比如为每个请求添加 True-Client-IP 标头，用于记录并传递客户端的真实 IP 地址。

针对这一类场景，我们在实际开发过程中，会比较关注标头的原始值、修改后的值、服务器实际接收到的值，这里我们提供一个方案，辅助您进行快速开发调试，在测试完成后您只需要切换源到实际的源端即可。

三. 方案架构介绍

以上是本次方案的架构图，我们使用 EchoServer 作为源站，它将有关 HTTP 请求标头和正文的信息回显给客户端；同时创建一个 CloudFront Function 关联到对应 CloudFront Distribution 的 Viewer Request 阶段。在该 Function 中，第一步遍历所有的标头，并通过对他们的 key 增加后缀的方式生成一个新的标头，用于记录请求标头的原始值；第二步，执行自定义逻辑，本案例中通过修改 User-Agent 标头进行模拟；第三方返回新的 request 信息。

四. 完整方案演示

步骤一：环境准备

您需要先创建一个 EchoServer 作为源站备用，具体创建方法在本系列之前的文章 Amazon CloudFront 部署小指南（二）- 进阶部署中有详细介绍，可供参考；接下来创建一个 CloudFront 分配并将刚刚的 EchoServer 作为源站；最后创建一个新的 CloudFront Function 并与刚刚的 CloudFront 分配进行管理。至此一个简单的环境便准备完毕。

步骤二：使用 CloudFront Function 模板

以下代码为本文提供的 CloudFront Function 模板代码，您可以将该代码完整的复制并替换刚刚创建的 CloudFront Function，替换后，您可以使用 CloudFront 测试功能进行简单的测试，测试无误即可执行发布。

function subHandler(event) {
    var request = event.request;
    request.headers['user-agent'] = { value: "newAgentName" }
    request.headers['function-version'] = { value: 'V02' }
    return request;
}

function handler(event) {
    var request = event.request;
    for (var key in request.headers) {
        request.headers[key + '-before'] = request.headers[key];
    }

    var newRequest = subHandler(event)
    return newRequest;
}

代码详细说明

本模板包含两个方法，分别是 subHandler 和 Handler，具体作用如下：

subHandler 方法：在该方法中实现您自己的处理逻辑，该方法与您原本编写 handler 方法时无任何差异，且最终上线时该方法会被更名为 handler 作为生产环境的主入口；在本示例中，将标头 user-agent 的值进行了重写；
handler 方法：遍历所有的标头，通过增加一个新的带后缀的标头进行原始值的记录；调用 subHandler 方法获得新的 request 并返回。

步骤三：测试

部署完成后，我们通过 curl 命令进行测试。从结果中，我们看到标头 User-Agent-Before 记录并输出了原始值，而 User-Agent 则被赋予了新的值并传递给服务器。

Tips：由于 CloudFront Function 更新到各个边缘节点存在短暂延迟，您可以通过 Function-Version 的值来确认当前请求所使用的版本。

curl http://xxxx.cloudfront.net/api/test

为了更方便的查看结果，我们可以通过 grep 命令进行过滤至查看关注的标头信息，命令及执行结果如下：

curl http://xxxx.cloudfront.net/api/test | grep User-Agent

步骤四：替换源为实际源站进行测试

使用 EchoServer 测试完成后，您可以在 CloudFront 中将源替换为实际的源站进行测试。如果服务端收到的结果有差异可以与 EchoServer 的结果进行对比验证。

步骤五：上线

测试完成后，您只需要将代码中原来的 handler 方法删除，并将 subHandler 更名为 handler 即可。处理效果如下：

至此，您可以使用该 Function 进行实际环境的部署。

总结

本篇文章提供了一个 CloudFront Function 模板，并结合 EchoServer 帮助您更加方便的通过 CFF 对标头进行处理，您可以将模板中 subHandler 方法中的内容进行修改，实现您自己的处理逻辑。

亚马逊云科技 CloudFront 部署小指南系列文章

Amazon CloudFront 部署小指南（一）- 快速构建 CDN 内容分发：https://aws.amazon.com/cn/blogs/china/amazon-cloudfront-deployment-handbook-part-one/

Amazon CloudFront 部署小指南（二）- 进阶部署：https://aws.amazon.com/cn/blogs/china/amazon-cloudfront-deployment-handbook-part-two/

Amazon CloudFront 部署小指南（三）- 持续部署：https://aws.amazon.com/cn/blogs/china/amazon-cloudfront-deployment-handbook-part-three/

Amazon CloudFront 部署小指南（四）- CloudFront Function 基础与诊断：https://aws.amazon.com/cn/blogs/china/amazon-cloudfront-deployment-handbook-part-four/

Amazon CloudFront 部署小指南（五）- 使用 AWS 边缘技术优化游戏内资源更新发布：https://aws.amazon.com/cn/blogs/china/amazon-cloudfront-deployment-handbook-part-five/

Amazon CloudFront 部署小指南（六）- Lambda@Edge 基础与诊断：https://aws.amazon.com/cn/blogs/china/amazon-cloudfront-deployment-handbook-part-six/

Amazon CloudFront 部署小指南（八）- 使用中国区 CloudFront 及 CloudFront SSL 插件部署免费证书：https://aws.amazon.com/cn/blogs/china/divert-website-access-traffic-from-ec2-to-amazon-cloudfront/

亚马逊AWS官方博客