告别繁琐配置：NAS 导航页的终极形态 —— 从 Sun-Panel 到 FlatNAS

1 为什么放弃 Homepage 选择 Sun-Panel？

对于每一个拥有 NAS 的玩家来说，随着 Docker 容器的增多，记住那一串串 IP:端口 简直是噩梦。我们在选择导航页时，通常会经历三个阶段：

导航页	颜值	配置难度	优点	缺点
Heimdall	⭐⭐	低	傻瓜式操作，应用库全	界面风格陈旧，不支持复杂组件
Homepage	⭐⭐⭐⭐⭐	极高	功能最强，支持 Docker Socket	纯 YAML 配置劝退，无后台，修改麻烦
Sun-Panel	⭐⭐⭐⭐	低	可视化拖拽，资源极低	原版部分高级样式需要付费
FlatNAS	⭐⭐⭐⭐⭐	低	解锁 Pro 功能，高度定制	本质是 Sun-Panel 的魔改，配置更自由

结论：Sun-Panel 及其增强版 FlatNAS 是目前的最佳平衡点——既有 Homepage 的现代颜值，又有 Heimdall 的可视化操作。

2 标准选择：Sun-Panel 部署指南

Sun-Panel 是一个服务器端渲染的轻量级导航页。它的核心逻辑是“极简”，镜像体积小，启动快，非常适合作为 NAS 的浏览器主页。

2.1 核心配置说明

账号信息：
初始账号：admin@sun.cc
初始密码：12345678
目录结构：已更新为 /mnt/docker/apps，与你的整体存储规划保持一致。
默认端口：使用官方默认的 3002 端口。

2.2 部署代码 (docker-compose.yaml)

name: sun-panel
# 最后编辑时间：2025-04-21
services:
  sun-panel:
    # 镜像地址
    image: hslr/sun-panel:latest
    container_name: sun-panel
    hostname: sun-panel
    # 路径映射
    volumes:
      - /mnt/docker/apps/sun-panel:/app/conf
      - /mnt/docker/apps/sun-panel/icon:/app/conf/uploads
      - /var/run/docker.sock:/var/run/docker.sock:ro
      - /mnt/docker/apps/sun-panel/custom:/app/web/custom
    network_mode: bridge
    ports:
      - 3002:3002
    restart: always

3 进阶完全体：FlatNAS 深度解析

你目前使用的 FlatNAS 是 Sun-Panel 的增强版。它不仅解除了原版的限制，还针对媒体播放、壁纸管理做了深度优化。

3.1 核心差异与功能亮点

账号信息：
默认账号：admin
默认密码：admin (注意：与原版 Sun-Panel 不同)
解锁 Pro 功能：无限制的分组、页脚自定义。
媒体增强：你专门映射了 music 和 PC/APP 壁纸目录，这意味着你可以直接在导航页播放 NAS 里的音乐，或者随机切换本地壁纸。
端口策略 (13000)：
我们将宿主机端口映射到了 13000。这是为了防止常用的 3000 端口已经被 AdGuard Home 或 MoviePilot 等项目占用。使用万位以上的高位端口，既安全又不容易撞车。

3.2 部署代码 (docker-compose.yaml)

name: flatnas
# 最后编辑时间：2025-12-18 23:24:38
services:
  flatnas:
    # 镜像地址 (QDNAS版本)
    image: qdnas/flatnas:latest
    container_name: flatnas
    hostname: flatnas
    volumes:
      # 基本数据路径
      - /mnt/docker/apps/flatnas/data:/app/server/data
      # 映射播放器路径 (支持本地音乐播放)
      - /mnt/docker/apps/flatnas/music:/app/server/music
      # 映射PC端壁纸路径 (用于轮播背景)
      - /mnt/docker/apps/flatnas/PC:/app/server/PC
      # 映射移动端壁纸路径
      - /mnt/docker/apps/flatnas/APP:/app/server/APP
      # 映射Docker (用于获取容器状态)
      - /var/run/docker.sock:/var/run/docker.sock
    ports:
      # webUI 端口 (注意容器端口为 3000)
      - 13000:3000
    restart: always

4 完美搭档：搭配自建图标库 HD-Icons (组合拳思路)

很多时候我们觉得导航页不够完美，最大的痛点是图标。用网络图片加载慢，用内置图标风格不统一。

4.1 终极解决方案：本地闭环

正如我之前的文章所介绍的，HD-Icons (Docker 版) 是一个运行在本地的高清图标仓库。把它和导航页部署在同一个 NAS 里，能打出一套完美的“内网闭环组合拳”。

4.2 为什么这套组合拳无敌？

毫秒级加载：图标数据直接走内网（例如 http://192.168.3.7:端口/icons/...），页面打开瞬间即达。
风格统一：HD-Icons 里有成千上万个经过筛选的高清图标（圆角、圆形、矢量），强迫症狂喜。
断网可用：即使外网断了，你的导航页图标依然完整，不会出现“裂图”。

4.3 联动操作流

部署 HD-Icons：在 NAS 上拉起镜像。
挑选图标：打开 HD-Icons Web 界面（如 十三的图标库），搜索应用名。
一键复制：点击图标，复制生成的本地 URL。
粘贴应用：在 FlatNAS 的图标设置里粘贴该 URL。

5 你的配置亮点与生态联动

5.1 Lucky 反向代理联动

配合 Sun-Panel，你可以实现内外网分流。在图标 URL 填入域名（如 https://nas.你的域名.com），配合 Lucky 的端口转发，无论你在家（内网）还是在公司（外网），点击同一个图标都能无缝访问。

5.2 资源挂载与界面定制

媒体中心化：FlatNAS 侧非常细致地挂载了 /mnt/... 下的媒体资源，让导航页兼具了简单的媒体中心功能。
特效注入：通过挂载 /custom 目录，你可以注入 JS/CSS 实现磨砂玻璃、动态背景等特效，让界面充满科技感。

6 总结与效果展示

6.1 极简清爽：Sun-Panel

如果你喜欢干净、无干扰的界面，Sun-Panel 是最佳选择。它资源占用极低，配合一张治愈的壁纸，能让你的 NAS 首页看起来非常轻盈。

6.2 深度定制：FlatNAS

如果你是折腾党，希望把导航页变成一个功能强大的“控制台”，FlatNAS 则是终极形态。配合 CSS 注入和本地 HD-Icons 图标库，你可以打造出像下面这样极具科技感和个人风格的界面。

左手 FlatNAS 负责高颜值的界面展示，右手 HD-Icons 负责极速的本地资源供给。这套组合拳打下来，你得到的不仅仅是一个导航页，而是一个完全自主可控、极速响应的个人数据中心门户。

Created with ❤️ by 十三

Thanks for reading!