🌐 在 AWS S3 上托管静态网站：新手入门分步指南
由 Mux 赞助的 DEV 全球展示挑战赛：展示你的项目！
👋嗨！我是Sarvar，一位对前沿技术充满热情的云架构师。我在云运维（AWS 和 Azure）、数据运维、数据分析、DevOps和GenAI方面拥有丰富的经验，并有幸与全球客户合作，交付具有影响力的解决方案。我始终关注最新的技术趋势，并乐于分享我的学习心得。让我们一起探索云计算和科技的世界吧！🚀
在当今的数字世界，拥有一个网站是分享信息、展示作品或开展业务的最佳方式之一。如果您拥有一个静态网站，即使用 HTML、CSS 和 JavaScript 构建的网站（不包含任何后端或服务器端代码，例如 PHP 或 Node.js），那么 AWS S3 是最便捷、最经济的托管方式之一。
我们正在做什么
在本指南中，我们将在 AWS S3 上托管一个简单的静态网站。我们将把网站文件（例如index.html图片等）上传到 S3 存储桶，并将其配置为可公开访问的网站。
为什么要使用 AWS S3？
在 AWS 上托管网站有几种不同的方法。例如，您可以使用 Amazon EC2，它可以让您完全控制一个虚拟服务器，您可以在上面安装任何内容。虽然 EC2 功能强大，但它也需要更多的设置和维护，而且对于简单的用例来说成本可能更高。而 S3（简单存储服务）的优势就在于此。它非常适合托管静态网站，也就是那些没有后端或数据库，主要由 HTML、CSS、JavaScript 和媒体文件组成的网站。S3 简单易用、可扩展且经济高效，只需点击几下即可让您的网站上线。
🚀 逐步指南：在 S3 上托管静态网站
让我们详细了解每个步骤。我们将搭建一个非常简单的网站，其中只有一个HTML文件和一张图片。
1. 准备您的网站文件
假设你有以下结构：
my-website/
├── index.html
└── images/
└── logo.png
你的index.html电脑可能看起来像这样：
<!DOCTYPE html>
<html>
<head>
<title>My First S3 Website</title>
</head>
<body>
<h1>Hello from AWS S3!</h1>
<img src="images/logo.png" alt="Logo">
</body>
</html>
提示：上传前请确保您的网站在本地可以正常运行。只需index.html在谷歌浏览器中打开该文件即可。
下载完成后：
images在您的目录中创建一个文件夹my-website（如果该文件夹尚不存在）。- 将下载的PNG图像移动到
images文件夹中。 - 将图像重命名为
logo.png.
2. 创建 S3 存储桶
-
转到AWS 管理控制台，搜索S3，然后打开它。
-
点击“创建存储桶”。
-
设置一个独一无二的名称，例如
dev-to-static-website-demo： -
暂时将其他设置保留为默认值，然后单击“创建存储桶”。
-
您的S3存储桶已成功创建。
3. 上传您的网站文件
-
打开你的桶。
-
点击上传→添加文件，然后选择您的文件
index.html。
-
点击“添加文件夹”，然后选择您的
images/文件夹。
-
最后，点击上传。
4. 启用静态网站托管
-
转到存储桶的“属性”选项卡。向下滚动到“静态网站托管”，然后单击“编辑”。
-
选择“启用”，然后选择“托管静态网站”。
-
对于索引文档，请键入：
index.html。
-
将错误文档留空，或者
error.html如果有错误文档，请输入内容，然后单击“保存更改”。
5. 将水桶公开
默认情况下，S3 会阻止公共访问。要允许任何人访问您的网站：
-
转到“权限”选项卡，然后在“阻止公共访问”下，单击“编辑”。
-
取消选中“阻止所有公共访问”，确认警告，然后单击“保存更改”。
6. 更新对象所有权和权限
-
仍在“权限”选项卡中，向下滚动到“对象所有权”，然后单击“编辑”。
-
选择启用 ACL，选中确认框，然后单击“保存更改”。
7. 公开您的文件
-
返回S3 存储桶中的“对象”选项卡。
-
选择所有文件和文件夹，然后单击“操作” → “使用 ACL 公开”。
-
确认更改以将您的文件设为公开访问。
8. 访问您的网站
这是最后一部分，已经整理完毕，可以发布了：
-
转到“属性”选项卡 > “静态网站托管”，然后复制存储桶网站端点 URL。
-
在浏览器中打开网址。🎉
恭喜！现在你应该可以在互联网上看到你的网站了！
结论：就是这样！只需几个步骤，我就使用 Amazon S3 托管了一个静态网站。最棒的是，我无需设置任何服务器、安装软件，也无需担心流量扩展。S3 会在后台自动处理所有这些工作。与 EC2 或其他传统托管方案相比，使用 S3 托管静态内容要简单得多。它速度快、成本低、可扩展。无论您是托管作品集、个人网站还是落地页，S3 都是绝佳之选。
——故事
到此结束！
✨感谢阅读！ ✨ 希望这篇文章能帮助您简化流程，并为您提供宝贵的见解。随着我不断探索日新月异的科技世界，我很高兴能与您分享更多指南、技巧和最新资讯。🚀敬请期待更多深入浅出、易于理解的复杂概念讲解。让我们一起学习，共同成长！💡
文章来源：https://dev.to/aws-builders/host-a-static-website-on-aws-s3-step-by-step-guide-for-beginners-4ifg