Docker部署FlatNas比Sun-Panel更好的多功能导航页 完全免费

        本文将介绍如何使用 Docker 部署 FlatNas，带你深入了解其强大的功能、智能的网络环境检测以及个性化的定制选项，助你打造属于自己的高效导航站点。无论是家庭用户还是开发者，FlatNas 都能成为你日常使用中的得力助手。

有关截图

主界面

小组件配置

RSS订阅

搜索引擎

万能窗口

多用户支持

功能亮点

仪表盘与布局

• 网格布局：自由拖拽布局，支持不同尺寸的组件。
• 分组管理：支持创建多个分组，分类管理应用和书签。
• 响应式设计：完美适配桌面端和移动端访问。
• 编辑模式：直观的所见即所得编辑体验，轻松添加、删除和重新排列组件。

🧩 丰富的小组件

FlatNas 内置了多种实用的小组件，满足日常需求：

• 书签组件：快速访问常用网站，支持自定义图标。首次启动时会自动填充常用的 10 个网站（如 GitHub、Bilibili 等）。
• 时钟与天气：实时显示当前时间、日期及当地天气情况。
• 待办事项 (Todo)：简单的任务管理，随时记录灵感和待办事项。
• RSS 订阅：内置 RSS 阅读器，实时获取订阅源的最新内容。
• 热搜榜单：集成微博热搜、新闻热榜等，不错过即时热点。
• 计算器：随时可用的简易计算器。
• 音乐播放器：内置 MiniPlayer，支持播放服务器端的本地音乐文件。

🎨 个性化定制

• 图标管理：内置图标库，支持上传自定义图片，并全面支持 Hex 颜色代码 (如 #ffffff) 自定义图标背景色。
• 背景设置：支持自定义壁纸。
• 分组卡片背景：支持在分组设置中统一配置该组所有卡片的背景（图片、模糊、遮罩），实现风格统一的视觉效果。
• 访客统计：底部页脚显示网站总访问量、今日访问量及当前在线时长（需在设置中开启）。
• 数据安全：本地存储配置 (server/data/data.json)，数据完全掌握在自己手中。
• 简单的密码访问保护：默认密码：admin，保护隐私配置。
• CGI 扩展：支持通过 Node.js 编写 CGI 脚本扩展后端功能（位于 server/cgi-bin）。
• 更新提醒：内置版本检测功能，自动检查 GitHub 最新 Release 版本，并在设置面板提示 Docker 更新。

智能网络环境检测

FlatNas 后端集成了智能网络环境识别功能，能够根据用户的访问来源自动切换内外网访问策略，完美解决混合网络环境下的访问难题。

1. 功能描述

• 多维度识别：结合客户端 IP、访问域名 和 网络延迟三个维度，精准判断用户当前所处的网络环境（局域网/互联网）。
• 自动路由：当检测到用户处于局域网（LAN）时，系统会自动优先使用配置的内网地址 (LanUrl)，实现高速直连；在公网环境则自动切换至外网地址。
• 无感切换：用户无需手动干预，无论是在家（内网）还是外出（外网），点击同一个图标即可自动跳转至最佳地址。

2. 技术实现

核心检测逻辑后端（server/server.js）与前端协同工作，实现了以下检测流程：

• IP 来源分析：后端通过解析 HTTP 请求头中的 X-Forwarded-For 和 Socket Remote Address 获取真实客户端 IP，支持 IPv4/IPv6 双栈识别。
• 网络连通性探测：提供 /api/ping 接口，后端调用系统底层 ICMP 协议探测目标主机（默认 223.5.5.5）的延迟，用于辅助判断服务器是否具备外网访问能力。

3. 使用指南

• 配置内网地址：在编辑模式下，右键点击任意组件选择”编辑”。在弹出的对话框中，除了填写”链接地址”（外网）外，还可以填写 “内网链接”。
  • 典型场景：
    • 家庭 NAS：外网填 https://nas.yourdomain.com，内网填 http://192.168.1.10:5000。

部署方法

本教程使用docker的方式安装部署,简单便捷

准备条件

1）一台服务器

推荐腾讯云海外服务器，只需要99元一年，免备案，购买地址：

https://cloud.tencent.com/act/pro/double11-2024?fromSource=gwzcw.8892861.8892861.8892861&utm_medium=cpc&utm_id=gwzcw.8892861.8892861.8892861&bd_vid=5226079512879123392

本期docker容器占用资源情况如下仅供参考,内存占用大约40M

2）本项目使用到的项目

本教程使用的官方github地址
https://github.com/Garry-QD/FlatNas

3）域名(可选)

根据自己的需求
如果部署在VPS的建议绑定下域名

① VPS部署

一、Docker环境部署

==推荐直接用一键脚本==

docker安装脚本

bash <(curl -sSL https://cdn.jsdelivr.net/gh/SuperManito/LinuxMirrors@main/DockerInstallation.sh)

docker-compose安装脚本

curl -L "https://github.com/docker/compose/releases/latest/download/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose && chmod +x /usr/local/bin/docker-compose

二、部署命令

登录服务器使用root账户执行以下步骤

docker-compose命令

创建一个目录，并进入此目录

mkdir flatnas ;cd  flatnas

然后再新建docker-compose.yml

vim docker-compose.yml

services:  flatnas:    image: qdnas/flatnas:latest  # 使用的镜像    container_name: flatnas  # 容器名称    restart: always  # 容器重启策略：无论容器退出状态如何，始终重启    ports:      - '23000:3000'  # 映射端口：将宿主机的23000端口映射到容器的3000端口    volumes:      - ./data:/app/server/data  # 映射本地 ./data 目录到容器的 /app/server/data      - ./music:/app/server/music   # 映射本地 ./music 目录(替换成你音乐的目录)到容器的 /app/server/music

三、执行容器运行命令

docker-compose up -d  #运行容器

docker-compose ps  #查看是否启动成功

==正常启动如下所示==

docker-compose psNAME      IMAGE                  COMMAND                  SERVICE   CREATED         STATUS         PORTSflatnas   qdnas/flatnas:latest   "docker-entrypoint.s…"   flatnas   6 seconds ago   Up 4 seconds   0.0.0.0:23000->3000/tcp, [::]:23000->3000/tcp

四、web界面

打开web页面使用
成功以后需要打开自己相应的端口23000)防火墙就可以web端访问了

主界面

http://ip:23000

直接ip加端口就可以了

默认管理员密码：
admin
自行修改

②飞牛云NAS部署

我们直接复制以上VPS的compose配置即可

启动成功

==注意音乐路径改成自己NAS的路径==