随着 Serverless 发展至今，越来越多的网站在部署时选择 Serverless 架构，其中静态网站是最为常见的类型。相比于传统服务器架构，Serverless 架构有着更高的可扩展性、高可靠性、更低的成本以及更短的上线时间。本文将详细介绍如何在 Serverless 架构下设置静态网站，包括如何将静态网站部署到 Amazon Web Services – AWS Lambda 和 Amazon S3 上，为涉及到的各类技术以及操作过程提供深度和学习以及指导意义。
Serverless 架构中的静态网站部署
静态网站是只由前端代码组成的网站，其中不包含任何服务器端的代码，因此静态网站可以非常方便地部署到 Serverless 架构上。Serverless 架构中，两个最常用的托管选项是 AWS Lambda 和 Amazon S3。
AWS Lambda
AWS Lambda 是一种事件驱动的计算服务，可以让您运行代码作为响应特定事件，例如 HTTP 请求、文件上传、数据库写入等等。因此，AWS Lambda 是一种可用于设置静态网站的 Serverless 架构。
AWS Lambda 来部署静态网站的基本思路是将静态网站的所有代码打包成 zip 文件，并将其通过 AWS CLI 或者 AWS 的 console 管理工具上传到 AWS Lambda 中。Lambda 会自动解压上传的 zip 文件并将代码部署到所需的存储桶中，接着您可以配置 API Gateway 触发器，将 Lambda 与 API Gateway 绑定并为其分配一个可访问的 URL，所有的前端代码都将从这个 URL 访问和下载。
一个典型的 AWS Lambda 部署静态网站的例子如下：
- 打包静态网站的所有代码
我们假设您的静态网站代码存在于 my-static-site 目录下，那么您可以使用如下命令打包所有代码：
cd my-static-site zip -r my-static-site.zip *
这会生成一个名为 my-static-site.zip 的压缩包，其中包含了所有的静态网站代码。
- 将静态网站上传到 AWS Lambda
接下来，使用 AWS CLI 工具将 my-static-site.zip 压缩包上传到 AWS Lambda 中：
aws lambda create-function --function-name my-static-site \ --zip-file fileb://my-static-site.zip \ --handler index.html --runtime nodejs14.x \ --role lambda_execution_role
上述命令会创建并部署一个名为 my-static-site 的函数，其中：
- function-name：指定创建的 Lambda 函数的名称。
- zip-file：指定上传的压缩包的路径。
- handler：指定入口文件的文件名。
- runtime：指定 Lambda 执行时的运行环境。
- role：指定 Lambda 执行的 IAM 角色。
- 配置 API Gateway 触发器
接下来，需要配置 API Gateway 触发器，将 Lambda 与 API Gateway 绑定，并为其分配一个可访问的 URL。具体步骤如下：
- 在 AWS 控制台中打开 API Gateway 服务。
- 创建 REST API，并将其命名为您的网站名称（例如 my-static-site）。
- 创建一个新的资源 /，并在该资源下创建一个 GET 方法，将其与 Lambda 函数绑定。
- 配置 API Gateway 和Lambda 之间的集成，以便在 API Gateway 接收到 GET 请求时，将调用 Lambda 函数。
- 部署 API Gateway 以使其在 Internet 上可用，
- 验证您的网站是否可以通过网关 URL 访问。
至此，您已成功地将静态网站部署到 AWS Lambda 和 API Gateway 上，网站的地址将是API Gateway 分配的 URL。
Amazon S3
除了 AWS Lambda，Amazon S3 也是 static website hosting 方面的专业服务。同样是无需服务器的静态内容服务，其提供了非常简单快捷的方式来部署您的网站。
Amazon S3 部署静态网站的基本思路是将您完整的网站代码上传到 S3 存储桶中，并在 S3 存储桶设置中启用静态网站托管。通过此方式，所有来自 Internet 的 HTTP/HTTPS 请求，都将自动转接到托管网站的 S3 存储桶中。
Amazon S3 部署静态网站的步骤如下：
登录 AWS 控制台，进入 Amazon S3 服务界面。
创建一个 S3 存储桶，并指定该存储桶托管您的网站。
将您的网站文件上传到 S3 存储桶中。
配置您的 S3 存储桶，以便正常托管静态网站。
完成上述步骤后，您的静态网站就已经成功托管在 Amazon S3 中了。
总结
本文主要介绍了如何在 Serverless 架构下设置静态网站，包括部署到 AWS Lambda 和 Amazon S3 上。无论您选择哪种方式，都可以使用 Serverless 架构来快速、便捷地部署您的静态网站。这对于对于想要建立自己的新网站或者在互联网上展示照片或者做托管一些 HTML、CSS 和 JavaScript 代码的时候会非常有帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a04dd348841e9894ca34b2