Align static deployment with existing Caddy gateway
This commit is contained in:
132
DEPLOY_STATIC.md
132
DEPLOY_STATIC.md
@@ -1,75 +1,123 @@
|
|||||||
# 高徳乐 AI 舵机选型助手:静态部署说明
|
# 高徳乐 AI 舵机选型助手:静态部署说明
|
||||||
|
|
||||||
本仓库已经提供纯静态构建方式。页面的产品数据、图片、选型计算、筛选和弹窗交互都在浏览器中运行,不依赖 Node.js、数据库、API 或 Cloudflare Worker 的运行时。
|
本项目提供纯静态构建方式。产品数据、图片、选型计算、筛选和弹窗交互都在浏览器中运行;网站运行时不需要 Node.js、数据库、API 或 Cloudflare Worker。
|
||||||
|
|
||||||
|
## 当前服务器的推荐方案
|
||||||
|
|
||||||
|
服务器已经有 Docker Compose 管理的 Caddy 网关,并且 Caddy 占用 80/443 端口。因此本项目应当:
|
||||||
|
|
||||||
|
1. 使用 `npm run build:static` 生成 `dist-static/`。
|
||||||
|
2. 将 `dist-static/` 同步到服务器静态目录。
|
||||||
|
3. 把静态目录以只读方式挂载到现有 Caddy 容器。
|
||||||
|
4. 在现有 Caddyfile 中增加 `duoji.dbpi.com.cn` 的站点配置。
|
||||||
|
|
||||||
|
不要为本项目另起 Nginx,不要让新容器绑定 80/443,也不要改动现有 `galderma-api` 和 `galderma-db` 容器。
|
||||||
|
|
||||||
## 给 Git AI 的部署任务
|
## 给 Git AI 的部署任务
|
||||||
|
|
||||||
可以直接把下面这段话发给仓库里的 AI:
|
可以直接把下面这段话发给仓库里的 AI:
|
||||||
|
|
||||||
> 请将本仓库部署为纯静态网站,不要启动 Node.js 后端、Vinext Server 或 Cloudflare Worker。先执行 `npm ci`,再执行 `npm run build:static`。把生成的 `dist-static/` 目录作为网站根目录发布到当前云服务器,并配置 Nginx 将未知路径回退到 `index.html`。如果服务器使用 Docker,请使用仓库中的 `Dockerfile.static` 构建并运行,容器端口为 80。部署完成后检查首页、`#selector`、`#products` 和 `#precision-gears` 页面区域,以及产品图片是否能正常加载。
|
> 请把本仓库部署为 `duoji.dbpi.com.cn` 的纯静态网站。不要执行 `npm run build`,不要启动 Vinext Server、Node.js 后端或 Cloudflare Worker;请执行 `npm run build:static`,发布生成的 `dist-static/` 目录。服务器已有 Docker Compose 管理的 Caddy 网关,80/443 端口不能抢占,也不要启动独立 Nginx 或新的 80 端口容器。请先检查现有 `/root/galderma/docker-compose.yml` 和 Caddyfile,在 Caddy 服务中增加只读挂载 `/var/www/duoji:/srv/duoji:ro`,并增加仓库 `deploy/Caddyfile.duoji` 中的站点配置。构建时服务器没有 Node.js,可使用一次性 `node:22-alpine` 容器构建,并用 `--tmpfs /src/node_modules` 避免把依赖写入宿主机。修改前备份 Caddy 配置,修改后先校验配置,再只重载 Caddy。不要改动 galderma-api、galderma-db 和现有站点,不要把密码、SSH 密钥或 token 写入仓库。最后用 curl 检查首页、产品图片和 HTTPS。
|
||||||
|
|
||||||
## 方式一:Nginx / 静态文件服务器
|
## 构建静态文件
|
||||||
|
|
||||||
在服务器项目目录执行:
|
如果服务器有 Node.js:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
git clone https://git.databerrypi.com/MJ-IT/gdm-Servo-model.git
|
|
||||||
cd gdm-Servo-model
|
|
||||||
npm ci
|
npm ci
|
||||||
npm run build:static
|
npm run build:static
|
||||||
```
|
```
|
||||||
|
|
||||||
将 `dist-static/` 下的全部文件复制到 Nginx 网站根目录,例如:
|
如果服务器没有 Node.js,可使用一次性 Docker 构建容器。该方式不会在宿主机留下 `node_modules`:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
sudo mkdir -p /var/www/gdm-servo
|
docker run --rm \
|
||||||
sudo rsync -a --delete dist-static/ /var/www/gdm-servo/
|
-v "$PWD":/src \
|
||||||
|
--tmpfs /src/node_modules \
|
||||||
|
-w /src \
|
||||||
|
node:22-alpine \
|
||||||
|
sh -lc 'npm ci && npm run build:static'
|
||||||
```
|
```
|
||||||
|
|
||||||
Nginx 的站点配置可以参考 [`deploy/nginx-static.conf`](deploy/nginx-static.conf)。其中最关键的是:
|
构建完成后,网站文件位于 `dist-static/`,入口是 `dist-static/index.html`。当前静态入口不依赖 `app/layout.tsx` 的动态 metadata,因此不要用 `npm run build` 代替 `npm run build:static`。
|
||||||
|
|
||||||
```nginx
|
## 与现有 Caddy 共存
|
||||||
root /var/www/gdm-servo;
|
|
||||||
|
|
||||||
location / {
|
### 1. 同步静态文件
|
||||||
try_files $uri $uri/ /index.html;
|
|
||||||
|
以下路径是示例,实际执行时让部署 AI 先确认服务器目录和权限:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
sudo mkdir -p /var/www/duoji
|
||||||
|
sudo rsync -a --delete dist-static/ /var/www/duoji/
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. 给 Caddy 服务增加只读目录挂载
|
||||||
|
|
||||||
|
在现有 Docker Compose 的 Caddy 服务中增加:
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
volumes:
|
||||||
|
- /var/www/duoji:/srv/duoji:ro
|
||||||
|
```
|
||||||
|
|
||||||
|
不要覆盖原有 volumes;只追加这一项。容器内的 `/srv/duoji` 对应本项目的静态文件目录。
|
||||||
|
|
||||||
|
### 3. 增加 Caddy 站点
|
||||||
|
|
||||||
|
将 [`deploy/Caddyfile.duoji`](deploy/Caddyfile.duoji) 的内容追加到现有 Caddyfile。配置核心如下:
|
||||||
|
|
||||||
|
```caddy
|
||||||
|
duoji.dbpi.com.cn {
|
||||||
|
root * /srv/duoji
|
||||||
|
encode gzip zstd
|
||||||
|
try_files {path} /index.html
|
||||||
|
file_server
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
以后更新时,在仓库目录执行:
|
修改前先备份 Caddyfile,并确认没有同名的 `duoji.dbpi.com.cn` 配置。修改后先验证,再重载 Caddy:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker exec galderma-caddy-1 caddy validate --config /etc/caddy/Caddyfile --adapter caddyfile
|
||||||
|
docker exec galderma-caddy-1 caddy reload --config /etc/caddy/Caddyfile --adapter caddyfile
|
||||||
|
```
|
||||||
|
|
||||||
|
如果现有容器内的 Caddyfile 路径不同,以 Docker Compose 的实际挂载路径为准。不要为了部署本项目执行整个 Compose 栈的重建或清理操作。
|
||||||
|
|
||||||
|
### 4. 验证
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -I https://duoji.dbpi.com.cn/
|
||||||
|
curl -I https://duoji.dbpi.com.cn/catalog-products/precision-gears/418.jpg
|
||||||
|
curl -I https://duoji.dbpi.com.cn/catalog-products/precision-gears-size/418.jpg
|
||||||
|
```
|
||||||
|
|
||||||
|
浏览器中再检查首页、`#selector`、`#products` 和 `#precision-gears`,并打开任意精密齿轮产品确认“产品尺寸”可以切换。
|
||||||
|
|
||||||
|
## 后续更新
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
git pull --ff-only origin main
|
git pull --ff-only origin main
|
||||||
npm ci
|
docker run --rm \
|
||||||
npm run build:static
|
-v "$PWD":/src \
|
||||||
sudo rsync -a --delete dist-static/ /var/www/gdm-servo/
|
--tmpfs /src/node_modules \
|
||||||
|
-w /src \
|
||||||
|
node:22-alpine \
|
||||||
|
sh -lc 'npm ci && npm run build:static'
|
||||||
|
sudo rsync -a --delete dist-static/ /var/www/duoji/
|
||||||
|
docker exec galderma-caddy-1 caddy reload --config /etc/caddy/Caddyfile --adapter caddyfile
|
||||||
```
|
```
|
||||||
|
|
||||||
运行时只需要 Nginx,不需要保留 Node.js 进程。
|
只更新静态文件时不需要重新构建或清理其他业务容器。
|
||||||
|
|
||||||
## 方式二:Docker
|
## 其他部署方式
|
||||||
|
|
||||||
仓库已经提供 [`Dockerfile.static`](Dockerfile.static):
|
仓库中的 [`Dockerfile.static`](Dockerfile.static) 和 [`deploy/nginx-static.conf`](deploy/nginx-static.conf) 可用于独立服务器或独立容器场景,但不适用于当前已经由 Caddy 占用 80/443 的服务器。当前服务器优先使用“静态文件 + 现有 Caddy”方案。
|
||||||
|
|
||||||
```bash
|
## 注意事项
|
||||||
docker build -f Dockerfile.static -t gdm-servo-static:latest .
|
|
||||||
docker run -d --name gdm-servo-static --restart unless-stopped -p 80:80 gdm-servo-static:latest
|
|
||||||
```
|
|
||||||
|
|
||||||
如果服务器已有 80 端口服务,可以改成 `-p 8080:80`,再由现有 Nginx 反向代理到 `127.0.0.1:8080`。
|
- 静态版的“申请样品”和“联系我们”表单目前只在浏览器中生成演示编号,不会将线索写入 CRM 或数据库。
|
||||||
|
- 如果后续要保存客户线索,需要另行接入表单 API、企业微信、CRM 或数据库,不要把密钥写进前端代码。
|
||||||
## 本地检查
|
- 页面使用根路径资源,建议部署在域名根路径,不建议直接部署到 `/servo/` 子目录。
|
||||||
|
- 目前尺寸图仅在产品详情弹窗切换到“产品尺寸”时加载,图片体积主要影响磁盘和用户主动查看尺寸图时的下载,不会首屏一次性加载全部图片。
|
||||||
```bash
|
|
||||||
npm run build:static
|
|
||||||
python3 -m http.server 8080 --directory dist-static
|
|
||||||
```
|
|
||||||
|
|
||||||
然后打开 `http://服务器IP:8080`。不要直接双击 `index.html`,因为浏览器会限制本地文件加载模块和图片资源。
|
|
||||||
|
|
||||||
## 部署注意事项
|
|
||||||
|
|
||||||
- 静态版没有服务端接口;当前“申请样品”和“联系我们”表单只在浏览器中生成演示编号,不会把线索写入 CRM 或数据库。
|
|
||||||
- 如果后续要真正保存客户线索,需要另行接入表单 API、企业微信、CRM 或数据库,不应把密钥写进前端代码。
|
|
||||||
- 页面使用根路径资源(例如 `/catalog-products/...`),因此建议部署在域名根路径。如果必须部署到 `/servo/` 子目录,需要同步调整 Vite 的 `base` 和图片资源路径。
|
|
||||||
- 每次产品数据或图片变更后,都要重新执行 `npm run build:static`,再同步整个 `dist-static/` 目录。
|
|
||||||
|
|||||||
6
deploy/Caddyfile.duoji
Normal file
6
deploy/Caddyfile.duoji
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
duoji.dbpi.com.cn {
|
||||||
|
root * /srv/duoji
|
||||||
|
encode gzip zstd
|
||||||
|
try_files {path} /index.html
|
||||||
|
file_server
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user