静态文件

Caddy 用 file_server 与 root 直接响应磁盘文件，或用 try_files 配合 SPA 回退。对照 ngx-static，语法更短，常与 reverse_proxy 混在同一站点块。

学习目标

• 配置 root、file_server 与目录浏览（慎用）
• 用 try_files 实现 admin 子域 SPA 回退
• 理解静态资源与反代在同一 Caddyfile 中的组合

核心内容

纯静态站点

admin.coderoadmap.cn {
    root * /var/www/admin/dist
    file_server
    encode gzip
}

root * 表示所有请求路径相对该目录；encode gzip 压缩文本类资源。

try_files（SPA / 预渲染回退）

admin.coderoadmap.cn {
    root * /var/www/admin/dist
    try_files {path} {path}/ /index.html
    file_server
}

等价 Nginx try_files $uri $uri/ /index.html;。Vue/React 管理端打包后常用此模式。

静态 + API 反代（admin 子域）

prod.conf.example 中 admin 为 静态 + /api 反代，Caddy 写法：

admin.coderoadmap.cn {
    handle /api/* {
        uri strip_prefix /api
        reverse_proxy 127.0.0.1:8080
    }
    handle {
        root * /var/www/admin/dist
        try_files {path} {path}/ /index.html
        file_server
    }
}

先匹配 API，其余走静态；与 caddy-api 主站双 handle 思路一致。

缓存与安全头

handle /assets/* {
    root * /var/www/admin/dist
    header Cache-Control "public, max-age=31536000, immutable"
    file_server
}

长期缓存带 hash 的构建产物；HTML 入口不宜长缓存。完整安全头见 ngx-headers，Caddy 用 header 指令。

练习

• 为测试目录写 file_server 并用 curl 验证 index.html
• 添加 try_files，访问 /dashboard/settings 仍返回 SPA
• 说明主站 Next :3000 与 admin 静态部署的分工