企业官网建设流程全解析

Docker Compose 把镜像、端口、挂载和启动策略放进一份 YAML 文件。本文用一个静态页面作为第一个项目，从准备文件、启动服务到访问验证、备份和清理逐步操作，适合已经能连接 Docker、但还不清楚 Compose 配置含义的新手。

1. 准备环境，先确认 daemon 可用

命令面向 Linux Bash，示例为 Ubuntu 24.04 LTS 上的 Docker Engine 与当前 Compose 插件。Windows 用户可以在 Docker Desktop 对应的 Linux 环境中练习；不要把下面的 Bash 文件创建命令直接粘贴到 PowerShell。

先运行：

dockerinfodockercompose version

第一条需要能返回 Server 信息；第二条应显示 Compose 版本。本文使用当前的docker compose命令形式，不依赖旧的独立docker-compose命令。

Linux 主机已经通过 Docker 官方软件仓库安装 Engine、但缺少 Compose 插件时，可按同一仓库的说明安装：

sudoapt-getupdatesudoapt-getinstalldocker-compose-plugin

这不是“任意 Ubuntu 都直接可用”的独立安装步骤。仓库尚未配置时，先完成 Docker 官方 Compose 安装说明 中的前置条件。

2. 建立项目：两个文件就够用

在自己的教学目录执行，已有同名项目时换一个目录，避免覆盖文件：

mkdir-pcompose-demo/sitecdcompose-demo

项目最终应包含：

compose-demo/ ├── compose.yaml └── site/ └── index.html

图 1：Compose 文件放在项目根目录，方便终端与编辑器定位。图中的应用还包含调试和源码文件；本篇只需要compose.yaml与site/index.html，无需生成整套应用脚手架。

图源：Microsoft / VS Code Compose 文档，© Microsoft Corporation，CC BY 3.0 US，原图未修改。

在site/index.html中保存以下内容：

<!doctypehtml><htmllang="zh-CN"><head><metacharset="utf-8"><metaname="viewport"content="width=device-width, initial-scale=1"><title>Compose Demo</title></head><body><h1>Compose Demo OK</h1><p>这个页面来自宿主机的 site/index.html。</p></body></html>

3. 编写 compose.yaml，逐项理解配置

在项目根目录保存：

name:compose-demoservices:web:image:nginx:1.28-alpineports:-"127.0.0.1:8080:80"volumes:-type:bindsource:./sitetarget:/usr/share/nginx/htmlread_only:truebind:create_host_path:falserestart:unless-stoppedlogging:driver:json-fileoptions:max-size:"5m"max-file:"3"

这份配置只有一个服务web。image指定镜像；ports发布访问入口；volumes把本机文件提供给容器；logging为这一容器的日志设置轮转，避免日志文件持续增长。Compose 服务配置

nginx:1.28-alpine指定版本系列，标签仍可能更新。需要严格复现时，在验证兼容性后记录并固定镜像摘要，也就是对应镜像内容的 digest；版本标签不等于永久不变的镜像内容。

图 2：打开配置文件，将鼠标移到image字段查看说明。截图用来定位编辑器功能；本篇直接使用上面的 YAML。当前 Compose 不需要旧示例中的version: "3.4"，它也不会锁定实际解析规则。Compose 的 version 字段说明

图源：Microsoft / VS Code 容器文档，© Microsoft Corporation，CC BY 3.0 US，原图未修改。

3.1 端口：左边是宿主机，右边是容器

127.0.0.1:8080:80表示宿主机回环地址的 8080 转发到容器 80。浏览器访问 8080，Nginx 仍在容器内监听 80。

图 3：8080 已占用时，换成127.0.0.1:8081:80，访问地址也要同步改为 8081。默认面向本机练习，不需要为了看到页面就开放公网端口。Docker 端口发布说明

3.2 挂载：网页文件留在宿主机

本篇采用 bind mount，意思是把主机目录挂到容器中的指定位置。read_only: true阻止容器通过这个挂载写回网页目录；主机上的编辑器仍能修改网页。

create_host_path: false让缺失目录直接报错，避免路径拼错后自动生成空目录。绑定挂载还会遮住目标目录原有内容，因此site/index.html必须存在且可读。绑定挂载说明

它与 Docker 管理的 named volume 不同。网页适合保留为本机文件；数据库数据则应按数据库官方方案选择卷和备份方式。

4. 检查、启动，然后真的打开网页

在compose.yaml所在目录执行：

dockercompose config-qdockercompose pulldockercompose up-ddockercomposepsdockercompose logs--tail=50web

config -q检查解析后的配置，不输出完整内容；没有错误并返回成功退出状态才算通过。它不能证明镜像已拉取、端口可用或程序能启动。Compose 配置检查

pull获取镜像，up按配置创建并启动项目，-d表示后台运行。首次拉取失败时，记录原始错误，分别检查网络、镜像名称和仓库响应，不直接关闭证书校验。

图 4：在 VS Code 的容器视图找到项目分组，右键可查看 Compose Logs。命令行ps负责确认状态，日志负责查看程序信息；两者都不能替代实际网页访问。

图源：Microsoft / VS Code 容器文档，© Microsoft Corporation，CC BY 3.0 US，原图未修改。

在 Docker 主机上验证：

curl--fail--show-error http://127.0.0.1:8080/

然后在同一台主机的浏览器打开http://127.0.0.1:8080/。验收目标是：web处于运行状态，HTTP 请求成功，页面显示Compose Demo OK，日志没有对应的启动错误。

图 5：Container Explorer 中右键目标容器，选择 Open in Browser；若有多个发布端口，核对所选端口。界面中的项目名不影响定位方法。

图源：Microsoft / VS Code Compose 文档，© Microsoft Corporation，CC BY 3.0 US，原图未修改。

项目运行在云服务器上，浏览器在哪里打开？

云服务器上的localhost属于服务器。可以用自己的 SSH 连接转发回环端口，在本地电脑终端执行：

ssh-N-L127.0.0.1:18080:127.0.0.1:8080 用户名@服务器地址

将用户名和服务器地址换成已验证可登录的值，保留这个连接，再在本地打开http://127.0.0.1:18080/。-N不执行远程命令，-L建立本地端口转发；本地 18080 需要空闲。

图 6：Remote-SSH 连接后，可在 Ports 面板转发远端 8080，再使用面板给出的本地访问地址。SSH 必须允许转发；回环访问失败时先检查服务，再检查转发状态。Remote-SSH 端口转发

图源：Microsoft / 同上文档，© Microsoft Corporation，CC BY 3.0 US，原图未修改。

5. 修改网页、停止项目与保留文件

在宿主机把index.html的标题改成Compose Demo Updated，刷新浏览器确认变化；必要时强制刷新以排除浏览器缓存。此时网页文件通过挂载提供，不需要重新构建镜像。

stop停止容器并保留项目容器，之后可start；down移除这个项目的容器和默认网络。执行前先确认自己位于教学项目目录：

dockercompose stopdockercompose start

练习结束后，可执行docker compose down。主机site目录仍然保留；再次up -d后应能访问更新后的页面。不要给清理命令随意添加--volumes，它会影响项目的卷。Compose down 说明

备份本例时，保存compose.yaml与site即可；在项目目录执行：

tar-czf../compose-demo-backup.tar.gz compose.yaml site

实际数据库项目要采用一致性备份，不能把本篇静态文件打包方式直接当成数据库备份方案。

6. 最容易卡住的地方

下一个项目可以在这份基础上增加应用服务与数据库。只有需要持续在线、定时运行或远程共享时，再考虑云端部署，并保留配置、备份和费用记录。