安全静态网站入门 - Amazon CloudFront
Amazon Web Services 文档中描述的 Amazon Web Services 服务或功能可能因区域而异。要查看适用于中国区域的差异,请参阅 中国的 Amazon Web Services 服务入门 (PDF)

本文属于机器翻译版本。若本译文内容与英语原文存在差异,则一律以英文原文为准。

安全静态网站入门

您可以开始使用 Amazon CloudFront ,方法是使用本主题中描述的解决方案为您的域名创建一个安全的静态网站。静态网站仅使用静态文件(例如 HTML、CSS JavaScript、图像和视频),不需要服务器或服务器端处理。使用此解决方案,您的网站将获得以下好处:

  • 使用 Amazon Simple Storage Service (Amazon S3) 的持久存储 – 此解决方案创建 Amazon S3 存储桶来托管静态网站的内容。要更新您的网站,只需将新文件上传到 S3 存储桶。

  • 由 Amazon CloudFront 内容交付网络加速 — 此解决方案创建了一个 CloudFront 分发,以低延迟将您的网站提供给浏览者。该分配配置了源站访问身份,以确保只能通过 S3 访问网站 CloudFront,而不能直接从 S3 访问该网站。

  • 由 HTTPS 和其他安全标头保护 — 此解决方案在 Amazon Certificate Manager(ACM) 中创建 SSL/TLS 证书,并将其附加到发行版中。 CloudFront 此证书使分配能够使用 HTTPS 安全地为您的域名网站提供服务。

    此解决方案还使用 Lambda@Edge 向每个服务器响应添加安全标头。安全标头是 Web 服务器响应中的一组标头,它们告诉 Web 浏览器采取额外的安全预防措施。有关更多信息,请参阅此博客文章:使用 Lambda @Edge 和亚马逊添加 HTTP 安全标头。 CloudFront

  • 使用 Amazon CloudFormation 进行配置和部署 – 此解决方案使用 Amazon CloudFormation 模板来设置所有组件,因此,您可以更多地关注网站的内容,而更少地关注配置组件。

此解决方案是开源的 GitHub。要查看代码、提交拉取请求或开设问题,请转到 https://github.com/aws-samples/amazon-cloudfront-secure-static-site

解决方案概述

下图显示此静态网站解决方案的工作原理的概述:


                安全静态网站的概述图  CloudFront
  1. 查看器在 www.example.com 上请求访问网站。

  2. 如果请求的对象已被缓存,则 CloudFront 会将该对象从其缓存中返回给查看者。

  3. 如果对象不在缓存 CloudFront中,则从源(S3 存储桶) CloudFront 请求该对象。

  4. S3 将对象返回到 CloudFront,这会触发 Lambda @Edge orig in 响应事件

  5. 该对象(包括 Lambda @Edge 函数添加的安全标头)已添加到 CloudFront的缓存中。

  6. (未显示)对象将返回给查看器。对到达相同 CloudFront 边缘位置的对象的后续请求将从 CloudFront缓存中处理。

部署解决方案

要部署此安全静态网站解决方案,您可以从以下任一选项中进行选择:

  • 使用 Amazon CloudFormation 控制台部署具有默认内容的解决方案,然后将您的网站内容上传到 Amazon S3。

  • 将解决方案克隆到您的计算机以添加您的网站内容。然后,使用 Amazon Command Line Interface (Amazon CLI) 部署解决方案。

注意

您必须使用美国东部(弗吉尼亚北部)区域来部署 CloudFormation 模板。

先决条件

要使用此解决方案,您必须具有以下先决条件:

  • 指向 Amazon Route 53 托管区域的注册域名(例如 example.com)。托管区域必须与部署此解决方案的Amazon Web Services 账户位置相同。如果您没有已注册的域名,可以向 Route 53 注册一个。如果您有注册的域名,但它未指向 Route 53 托管区域,请将 Route 53 配置为您的 DNS 服务

  • Amazon Identity and Access Management(IAM) 启动创建 IAM 角色的 CloudFormation 模板的权限,以及创建解决方案中所有Amazon资源的权限。

使用此解决方案时产生的费用由您负责。有关费用的更多信息,请参阅每种费用的定价页面Amazon Web Service

使用 Amazon CloudFormation控制台

使用 CloudFormation 控制台进行部署
  1. 选择启动以在 Amazon CloudFormation 控制台中打开此解决方案。如有必要,请登录您的Amazon Web Services 账户。

  2. 创建堆栈向导将在 CloudFormation控制台中打开,其中包含用于指定此解决方案 CloudFormation模板的预填字段。

    在页面底部,选择 Next

  3. Specify stack details (指定堆栈详细信息) 页面上,输入以下字段的值:

    • SubDomain— 输入用于您的网站的子域名。例如,如果子域名为 www,则您的网站在 www.example.com 上可用。(将 example.com 替换为您的域名,如以下项目符号中所述。)

    • DomainName— 输入您的域名,例如 e xample.com。此域必须指向 Route 53 托管区域。

    • HostedZoneId— 您的域名的 Route 53 托管区域 ID。

    在完成后,选择下一步

  4. (可选)在配置堆栈选项页面上,添加标签和其他堆栈选项

    在完成后,选择下一步

  5. Review (审核) 页面上,滚动到页面底部,然后选择 Capabilities (功能) 部分中的两个框。这些功能允许 Amazon CloudFormation 创建允许访问堆栈资源并动态命名这些资源的 IAM 角色。

  6. 选择创建堆栈

  7. 等待堆栈完成创建。堆栈会创建一些嵌套堆栈,并且可能需要几分钟才能完成。完成后,Status (状态) 将更改为 CREATE_COMPLETE

    当状态为 CREATE_COMPLETE 时,请转到 https://www.example.com,以查看您的网站(将 www.example.com 替换为您在步骤 3 中指定的子域名和域名)。您应该看到网站的默认内容:

    
                            此解决方案的静态网站默认内容。它说:“我是一个静态网站!”
将网站的默认内容替换为您自己的内容
  1. 通过以下网址打开 Amazon S3 控制台:https://console.aws.amazon.com/s3/

  2. 选择名称以-s amazon-cloudfront-secure-staticite-s3bucketroot- 开头的存储桶。

    注意

    请确保选择名称中包含 s3bucketroot 而不是 s3bucketlogs 的存储桶。名称中包含 s3bucketroot 的存储桶包含网站内容。具有 s3bucketlogs 的存储桶只包含日志文件。

  3. 删除网站的默认内容,然后上传您自己的内容。

    注意

    如果您使用此解决方案的默认内容浏览网站,则某些默认内容很可能已缓存在 CloudFront 边缘位置。为确保浏览者看到您更新的网站内容,请使文件失效,以便从 CloudFront 边缘位置移除缓存的副本。有关更多信息,请参阅使文件失效

本地克隆解决方案

先决条件

要在部署此解决方案之前添加网站内容,您必须在本地打包解决方案的构件,这需要 Node.js 和 npm。有关更多信息,请参阅 https://www.npmjs.com/get-npm

添加网站内容并部署解决方案
  1. 从 克隆或下载解决方案https://github.com/aws-samples/amazon-cloudfront-secure-static-site 克隆或下载后,打开命令提示符或终端并导航到 amazon-cloudfront-secure-static-site 文件夹。

  2. 运行以下命令来安装并打包解决方案的构件:

    make package-static
  3. 将网站的内容复制到 www 文件夹中,覆盖默认网站内容。

  4. 运行以下 Amazon CLI 命令创建 Amazon S3 存储桶以存储解决方案的构件。example-bucket-for-artifacts用您自己的存储桶名称替换。

    aws s3 mb s3://example-bucket-for-artifacts --region us-east-1
  5. 运行以下 Amazon CLI 命令将解决方案的构件打包为 Amazon CloudFormation 模板。example-bucket-for-artifacts替换为您在上一步中创建的存储桶的名称。

    aws cloudformation package \ --region us-east-1 \ --template-file templates/main.yaml \ --s3-bucket example-bucket-for-artifacts \ --output-template-file packaged.template
  6. 运行以下命令以使用 Amazon CloudFormation 部署解决方案,同时替换以下值:

    • y CloudFormation our-stack-name — 替换为堆栈的名称。Amazon CloudFormation

    • example.com – 替换为您的域名。此域必须指向同一 Amazon 账户中的 Route 53 托管区域。

    • www – 替换为要用于您的网站的子域名。例如,如果子域名为 www,则您的网站在 www.example.com 上可用。

    aws cloudformation deploy \ --region us-east-1 \ --stack-name your-CloudFormation-stack-name \ --template-file packaged.template \ --capabilities CAPABILITY_NAMED_IAM CAPABILITY_AUTO_EXPAND \ --parameter-overrides DomainName=example.com SubDomain=www
  7. 等待 Amazon CloudFormation 堆栈完成创建。堆栈会创建一些嵌套堆栈,并且可能需要几分钟才能完成。完成后,Status (状态) 将更改为 CREATE_COMPLETE

    当状态更改为 CREATE_COMPLETE 时,请转到 https://www.example.com 以查看您的网站(将 www.example.com 替换为您在前面步骤中指定的子域名和域名)。您应该看到您网站的内容。

查找访问日志

此解决方案为 CloudFront分发启用访问日志。完成以下步骤以查找此分配的访问日志。

查找分配的访问日志
  1. 通过以下网址打开 Amazon S3 控制台:https://console.aws.amazon.com/s3/

  2. 选择名称以-s amazon-cloudfront-secure-staticite-s3bucketlogs- 开头的存储桶。

    注意

    请确保选择名称中包含 s3bucketlogs 而不是 s3bucketroot 的存储桶。名称中具有 s3bucketlogs 的存储桶包含日志文件。带有 s3bucketroot 的存储桶包含网站内容。

  3. 名为 cdn 的文件夹包含 CloudFront 访问日志。