只需 7 个步骤,即可使用 S3、CloudFront 和 Route53 在 AWS 上托管静态网站
想寻找一种简单、快速且可靠的静态网站托管方式吗?不妨试试亚马逊网络服务 (AWS) 提供的AWS S3和CloudFront服务!借助Route53 的DNS 路由功能,网站流量的引导从未如此顺畅。访客只需在浏览器中输入您的域名(例如olumoko.live)即可访问您的网站。现在,让我们开始体验完美的托管解决方案吧!
读完这篇入门指南文章后,您将能够通过在Amazon S3上部署网站,使用Amazon CloudFront提供网站内容服务来提升网站速度、可靠性、成本效益和安全性,并使用Amazon Route 53将 流量路由到提供网站内容的 CloudFront 分发点,从而在 AWS 上托管静态网站。前提条件
- 您需要一个 AWS 账户;如果您还没有账户,请在此处注册。
- 要了解 DNS 及其工作原理,请点击此处深入了解 DNS 和 Route53。
- 如果您想要一个自定义域名,例如olumoko.online,请点击此处在 Amazon Route53 注册自定义域名,或点击此处在 GoDaddy 获取自定义域名。
- 请准备好您的网站文件(HTML),如果您还没有,请点击此处查看并复制其中的示例。
什么是静态网站?
静态网站是指由固定内容(通常是 HTML、CSS 和 JavaScript 文件)组成的网站,这些内容会按原样提供给所有访问者,不会根据用户交互而改变,也没有任何后端或数据库处理。
什么是 Amazon S3?
Amazon S3(简单存储服务)是 AWS 提供的一项基于云的存储服务,它允许用户通过互联网存储和检索数据。它为各种数据类型(包括对象存储、文件、文档和多媒体内容)提供可扩展、可靠且高可用的存储基础设施。
什么是 CloudFront?
CloudFront 是 AWS 提供的一种内容分发网络 (CDN) 服务,它使用户能够以低延迟、高数据传输速度和安全的方式在全球范围内分发内容。CloudFront
利用遍布全球的 AWS 边缘节点缓存内容,并从距离用户最近的节点进行分发,从而降低延迟并提升性能。
它还提供 SSL/TLS 加密、访问控制和实时指标等功能。
什么是 Route53?
Route53 是 AWS 提供的高可用性、可扩展的云端 DNS 服务,它允许您将流量路由到 CloudFront、EC2 实例、S3 存储桶和弹性负载均衡器等资源。
什么是 AWS Certificate Manager?
AWS Certificate Manager (ACM) 是 AWS 提供的一项服务,可让您轻松地为 AWS 服务和应用程序配置、管理和部署 SSL/TLS 证书。SSL
/TLS 证书用于在 Web 浏览器和 Web 服务器之间建立安全连接,并通过加密数据来保护凭证和支付详情等敏感信息。
现在跟我来,我们用7个步骤完成这件事!
1. 创建用于静态网站托管的 S3 存储桶
在 AWS 控制台中,搜索 S3,然后在 S3 控制面板的“创建存储桶”中,输入一个全局唯一的存储桶名称(因为两个人不能使用相同的名称),并指定您首选的区域。

然后取消勾选“阻止所有公共访问”,并勾选确认信息,其余配置保持默认即可。注意:我取消勾选此项只是为了测试我们的网站即使托管在 S3 上也能被访问,一旦确认可以访问,我们会立即将其关闭,因为取消勾选“阻止所有公共访问”会使您的网站内容和数据对公共互联网上的任何人(包括黑客和其他恶意行为者)开放,从而使其变得不安全。
2. 将网站内容上传到 S3
点击您的 S3 存储桶,点击上传,然后点击“添加文件”,选择并上传您的网站文件(HTML 文件)。
3. 配置网站访问的 S3 存储桶权限
在 S3 存储桶中,点击“权限”选项卡,点击“编辑权限”,然后粘贴以下 JSON 配置:
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "AddPerm",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::YOUR_BUCKET_NAME/*"
}
]
}
将配置中的“YOUR_BUCKET_NAME”替换为您的存储桶名称,然后单击保存。
4. 在 S3 上启用静态网站托管
点击 S3 存储桶中的“属性”选项卡,向下滚动找到“静态托管”,然后点击它。默认情况下,它是禁用的,点击启用静态托管,按照快照中的配置进行操作,然后保存。

我们已经成功将网站托管在 S3 上,向下滚动即可找到“存储桶网站端点”,复制并粘贴到您的 Web 浏览器中,即可访问您的网站。

我知道您肯定想问:“如果我们的网站仅仅托管在 S3 上就能正常运行,那为什么还需要 CloudFront 呢?”您会注意到我们的网站有一个“不安全”的标签,这意味着即使我们的网站现在托管在云端,它仍然不安全。因此,我们需要 CloudFront 来安全地向访客或用户提供网站内容。
现在我们的网站可以正常运行了,在 S3 控制面板中,点击“属性”,勾选“阻止所有公共访问”,保存,然后继续执行后续步骤。
5. 为 CloudFront 创建 SSL/TLS 证书
在 AWS 控制台中搜索 AWS Certificate Manager (ACM),点击“请求证书”,输入您的自定义域名(在我的例子中是 olumoko.online),选择 DNS 验证,然后点击请求。
点击“查看证书”, 点击证书 ID,然后点击“在 Route 53 中创建记录”,点击“创建记录”,然后等待状态从“待验证”变为“成功”。 如果您在 Route 53 中检查您的域名, 您应该会找到一个新的名为“CNAME”的记录集,这样您就可以开始使用 ACM 了。6.配置 CloudFront 分发以进行网站交付 。在 CloudFront 控制面板中,点击“创建 CloudFront 分发”,然后在“源域”字段中选择您的 S3 源域。向下滚动,在“备用域名 (CNAME)”字段中输入您的域名,然后在“自定义 SSL 证书”字段中选择您的证书管理器,在“默认根对象”字段中输入您的网站 HTML 文件(index.html) , 然后点击“创建分发”。





在您的分发控制面板中,点击“常规”,复制您的 CloudFront“分发域名”,并将其粘贴到您的 Web 浏览器中,即可安全地访问您的网站 。

现在你可能又会问:“我们的网站运行正常且安全,为什么还需要 Route 53?”使用 Route 53 的众多原因之一是,访客很难记住 CloudFront 端点,对吧?所以,使用自定义域名可以让用户更容易记住并访问你的网站,现在我们都同意,“olumoko.online”比 CloudFront 端点更容易记住。
7. 配置 Route 53 进行 DNS 管理
在 Route 53 控制面板中,点击托管区域,点击您的域名,然后点击“创建记录”。
在该记录中,启用您的别名,设置记录类型,设置路由策略,并在“路由流量至”字段中选择您的 CloudFront“分发域名”。 创建记录后,点击“查看状态”以了解您的域名何时可以用于访问您的网站。 如果状态为“INSYNC”(同步),则表示您现在可以使用自定义域名访问您的网站。 太棒了!您的访客现在只需在 Web 浏览器中输入您的自定义域名即可访问您的网站,快速、便捷且安全。



总结:
很简单吧?恭喜!您仅用了 7 个步骤就成功地在 AWS 上托管了静态网站。AWS S3、CloudFront 和 Route53 提供了强大的托管、缓存和 DNS 管理服务组合,使您的网站在 AWS 上托管既可靠又经济高效。
感谢您阅读本指南直至最后,祝您托管网站愉快!🥂
