当前位置：首页 > 文章列表 > 文章 > 前端 > CI/CD部署静态网站详细教程

CI/CD部署静态网站详细教程

2025-09-15 23:45:59 0浏览收藏

想知道如何通过CI/CD快速部署你的静态网站吗？本文为你提供了一份详细的教程，教你如何利用CI/CD系统（例如Bamboo）将单元测试结果、代码分析报告等构建过程中生成的静态网站文件，自动化部署到远程服务器，极大地提升开发和协作效率。文章深入讲解了核心思路，即将静态网站文件设置为构建产物，并通过SCP或SSH任务等方式传输并部署到Web服务器的指定目录。更包含详细的部署步骤，从构建任务生成静态网站、配置构建产物，到创建和配置部署计划，再到触发器的设置，手把手教你完成部署。此外，还提供了Bamboo的示例配置，以及权限、Web服务器配置和安全性等注意事项，助你轻松实现静态网站的自动化部署，提升开发效率。

利用 CI/CD 系统部署静态报告网站

在持续集成/持续部署 (CI/CD) 流程中，经常需要生成各种报告，例如单元测试结果、静态代码分析报告等。如果能将这些报告以静态网站的形式呈现，并自动部署到服务器上，就能极大地提高开发效率和协作效率。本文将介绍如何利用 CI/CD 系统，例如 Bamboo，实现这一目标。

核心思路

核心思路是将构建过程中生成的静态网站文件（HTML, CSS, JS, JSON 等）作为构建产物 (Artifact)，然后利用 CI/CD 系统的部署功能，将这些产物传输到远程服务器，并部署到 Web 服务器的指定目录中。

部署步骤

构建任务生成静态网站: 确保你的构建任务能够生成完整的静态网站文件，例如将测试结果、代码分析结果等生成为 HTML 文件，并将其打包到一个目录中。
将静态网站设置为构建产物: 在 CI/CD 系统中，将包含静态网站文件的目录设置为构建产物。这样，每次构建成功后，这些文件都会被保存下来，供后续的部署任务使用。
创建部署计划: 在 CI/CD 系统中创建一个部署计划，用于将构建产物部署到远程服务器。
配置部署任务: 在部署计划中，添加以下任务：
- SCP 任务 (或类似的文件传输任务): 使用 SCP (Secure Copy) 或其他文件传输协议，将构建产物（静态网站文件）从 CI/CD 服务器传输到远程服务器。你需要配置远程服务器的地址、用户名、密码（或 SSH 密钥）以及目标目录。目标目录通常是 Web 服务器（例如 Apache 或 Nginx）的 HTML 根目录，例如 /var/www/html。
```
# 示例：SCP 任务配置
Source:  ${bamboo.results.artifact.static_report}  # 构建产物路径
Destination Host:  your_server_ip
Destination User:  your_username
Destination Path:  /var/www/html/report
```
- SSH 任务 (可选): 如果构建产物是压缩包（例如 ZIP 文件），可以使用 SSH 任务在远程服务器上解压文件。
```
# 示例：SSH 任务配置
Host: your_server_ip
User: your_username
Command: unzip /var/www/html/report.zip -d /var/www/html/report
```
配置触发器: 设置部署计划的触发器，使其在构建任务成功完成后自动触发。这样，每次构建成功后，静态网站都会自动部署到服务器上。

示例配置 (Bamboo)

假设你的 Bamboo 构建计划生成了一个名为 static_report 的构建产物，包含了静态网站文件。

创建 Bamboo 部署计划。
添加一个 "SCP Task"：
- Source: ${bamboo.results.artifact.static_report}
- Destination Host: your_server_ip
- Destination User: your_username
- Destination Path: /var/www/html/report
(可选) 添加一个 "SSH Task"：
- Host: your_server_ip
- User: your_username
- Command: unzip /var/www/html/report.zip -d /var/www/html/report
配置触发器，使其在构建计划成功完成后触发。