19
21
绿联NAS：搭建NCE Flow，英语在线点读，点句即读、连续播放
2026-10-19 18:45:15
1点赞
0收藏
0评论
一、项目介绍
NCE-Flow 是一款专为英语学习者打造的轻量化 Web 学习进度管理工具。它帮助用户记录课文学习状态、管理学习笔记，并支持多设备数据同步。不同于将数据存在浏览器里的单机应用，NCE-Flow 具备服务端数据持久化能力，清理浏览器缓存或更换设备都不会丢失学习进度。项目还支持通过挂载卷热更新课程内容，并可通过设置访问令牌保障数据安全。项目采用 OpenResty (Nginx) + 静态前端 + 本地数据存储的极简架构。推荐使用 Docker Compose 进行本地构建与一键部署，非常适合有一定动手能力、追求数据私有化，且需要跨终端无缝继续学习的英语爱好者。
核心功能
句子级点读：点击任意句子开始播放，自动高亮跟随
多语言视图：EN / EN+CN / CN 三种显示模式
播放控制：倍速调节、连读/点读切换、循环模式、断点续播
全局快捷键：空格播放/暂停、方向键导航、音量控制
学习管理：课程收藏、学习记录、进度追踪
现代界面：Apple 风格、深浅色主题、响应式设计
零依赖：纯静态文件，解压即用
二、搭建教程
1、使用电脑打开浏览器下载项目；
下载地址：https://gitcode.com/gh_mirrors/nc/echo-flow
image
2、打开绿联NAS-文件管理器-找到docker文件夹，创建文件夹nceflow；
image3、把下载的项目上传到docker文件下的nceflow文件夹，并解压；
image
image4、把解压的文件全部放到nceflow文件下（记得检查下有没有static文件夹，不然构建的时候会报错）；
image5、打开docker -项目-创建nceflow项目；
image6、粘贴docker compose；
# =============================================================================
# NCE-Flow 部署配置（本地构建版）
# -----------------------------------------------------------------------------
# 项目地址：https://github.com/luzhenhua/NCE-Flow
# 说明：Docker Hub 上没有该项目的公开镜像，必须 clone 源码后本地构建。
# 访问地址：http://localhost:11223
#
# 常用命令：
# docker compose build # 单独构建镜像（方便看构建报错）
# docker compose up -d # 构建（如需要）并后台启动
# docker compose up -d --build # 强制重新构建后启动（改代码后用）
# docker compose ps # 查看状态，重点关注是否 healthy
# docker compose logs -f # 实时查看日志
# docker compose down # 停止并删除容器（./data 数据保留）
#
# 注意：Compose V2 已废弃 version 字段，这里不写，写了会提示 obsolete。
# =============================================================================
services:
# ---------------------------------------------------------------------------
# 服务名，compose 内部用它互相引用（本项目单服务，叫什么都能跑）
# 与 container_name 是两回事：这是逻辑名，下面是容器实际名字
# ---------------------------------------------------------------------------
nce-flow:
# -------------------------------------------------------------------------
# 构建配置：用当前目录（仓库根目录）的 Dockerfile 本地构建镜像
# - context: . 表示构建上下文是当前目录
# - dockerfile 省略 默认就是 ./Dockerfile；若 Dockerfile 在子目录，改为：
# build:
# context: .
# dockerfile: docker/Dockerfile
# -------------------------------------------------------------------------
build: .
# -------------------------------------------------------------------------
# 给构建产物起个名字。
# 不加这一行，构建出的镜像会显示为 :，后续 docker images
# 里难以识别、也不方便单独删除。名字可自定义，仅本地使用不推送到仓库。
# -------------------------------------------------------------------------
image: nce-flow:local
# -------------------------------------------------------------------------
# 容器名，对应 docker run --name nce-flow
# 加了它之后容器名固定，方便 docker exec / docker logs 直接用名字；
# 代价是同一台机器上不能并行跑两份该 compose（会重名冲突）。
# 如果将来要做蓝绿/多实例部署，删掉这一行让 compose 自动生成名字。
# -------------------------------------------------------------------------
container_name: nce-flow
# -------------------------------------------------------------------------
# 端口映射：宿主机 11223 -> 容器 80（nginx 默认端口）
# 格式是 "宿主机端口:容器端口"。容器内 nginx 监听 80，这部分不要改；
# 只改了冒号左边，对外访问变为 http://localhost:11223
# 如果 11223 也被占用，只改左边即可，例如 "12345:80"
# -------------------------------------------------------------------------
ports:
- "11223:80"
# -------------------------------------------------------------------------
# 重启策略：
# no 从不自动重启（默认）
# always 除非手动 stop，否则总是重启（含宿主机重启后）
# unless-stopped 同 always，但手动 stop 后不会自动拉起 ← 当前选择
# on-failure 非 0 退出码才重启
# unless-stopped 是最常用的折中：宿主机重启、容器崩溃都会自动恢复，
# 但你主动 docker compose stop 后它保持停止状态。
# -------------------------------------------------------------------------
restart: unless-stopped
# -------------------------------------------------------------------------
# 数据卷挂载：宿主机目录 -> 容器内目录
# -------------------------------------------------------------------------
volumes:
# 【核心】服务端数据持久化与多设备同步
# 挂载后用户数据自动落到宿主机 ./data 目录（相对于 compose 文件所在目录），
# 即使删除容器、清浏览器缓存、重新构建镜像，数据都不会丢失。
# 备份/迁移时只需把 ./data 整个目录拷走。
# 注意：首次启动会自动创建该目录，权限由容器内进程决定；
# 若出现写入失败，检查宿主机目录属主（必要时 chown 101:101）。
- ./data:/app/data
# 【可选】运行时热更新静态页面内容（改宿主机文件即时生效，无需重建镜像）
# 需要改哪块就取消对应那行的注释；目录不存在时 compose 会自动创建空目录，
# 若容器内原本有内容会被空目录覆盖，请先把内容拷到宿主机对应目录。
# - ./NCE1:/usr/share/nginx/html/NCE1
# - ./NCE2:/usr/share/nginx/html/NCE2
# - ./NCE3:/usr/share/nginx/html/NCE3
# - ./NCE4:/usr/share/nginx/html/NCE4
# -------------------------------------------------------------------------
# 环境变量（可选）
# -------------------------------------------------------------------------
# environment:
# 设置访问令牌后，需在应用「设置」页填入同一令牌才能同步数据。
# 这是简易鉴权，不是强安全方案；公网暴露时建议再加反向代理 + HTTPS。
# - NCE_DATA_TOKEN=change-me
# 时区（如需日志/时间显示为北京时间可打开）
# - TZ=Asia/Shanghai
# -------------------------------------------------------------------------
# 健康检查：定期探测容器内服务是否真的可用
# 注意：这里探测的是「容器内」地址，端口固定是 80，
# 与宿主机映射的 11223 无关，改端口时不需要动这里。
# -------------------------------------------------------------------------
healthcheck:
# 探测方式说明：
# - 若基础镜像是 nginx:alpine，busybox 自带 wget，用下面这行即可
# - 若是 nginx:latest 等 Debian 基础镜像，默认没有 wget/curl，
# 用 wget 会一直 unhealthy，此时改用：
# test: ["CMD-SHELL", "bash -c '/tcp/127.0.0.1/80' || exit 1"]
# 或者更轻量：test: ["CMD", "nginx", "-t"]
# 先确认基础镜像：grep '^FROM' Dockerfile
test: ["CMD-SHELL", "wget -q --spider http://localhost/ || exit 1"]
# 检查间隔：每 30 秒探测一次
interval: 30s
# 单次探测超时：超过 10 秒视为本次失败
timeout: 10s
# 连续失败 3 次才判定为 unhealthy（避免偶发抖动误报）
retries: 3
# 启动宽限期：容器启动后 40 秒内不判定失败，
# 给 nginx 初始化和首次构建的静态资源准备留出时间
start_period: 40s
# -------------------------------------------------------------------------
# 【可选】日志轮转
# Docker 默认日志无限增长，长期运行可能把磁盘写满，建议打开下面配置：
# -------------------------------------------------------------------------
# logging:
# driver: json-file
# options:
# max-size: "10m" # 单个日志文件最大 10MB
# max-file: "3" # 最多保留 3 个文件，超出自动删除旧的
# -------------------------------------------------------------------------
# 【可选】资源限制（Compose V2 单机可用 deploy.resources 或 mem_limit）
# 个人小站一般不需要，共享主机或 VPS 内存紧张时可加上：
# -------------------------------------------------------------------------
# deploy:
# resources:
# limits:
# cpus: "1.0"
# memory: 512M
# =============================================================================
# 关于 networks：
# 本项目只有一个服务，使用 compose 默认创建的 bridge 网络即可，
# 无需显式声明自定义网络。将来若增加反向代理（如 caddy / nginx-proxy）
# 等第二个服务需要互通时，再加：
#
# networks:
# nce-network:
# driver: bridge
#
# 并在服务下加 networks: [nce-network]，两边都声明才能互相解析。
# =============================================================================
image
7、点击立即部署，等待跑码；
image8、等待完成后，点击完成；
image9、启动服务后，直接在浏览器访问 http://NAS_IP:11223 ;比如我的是http://192.168.1.200:11223；
image三、参考文档
1、gitcode：https://gitcode.com/gh_mirrors/nc/echo-flow；
2、在线体验: https://nceflow.zhenhua.lu。
四、免责声明
重要声明：本项目的内容仅限个人学习、研究或欣赏之用，完全没有丝毫商业用途。
本项目仅作为辅助正版新概念英语教材的学习工具
音频与文本内容的版权归原著作权人所有
严禁用于任何商业目的或未经授权的传播
使用本项目即表示您同意上述条款
支持正版
本人在学习过程中使用的是正版新概念英语教材。为了帮助同样热爱新概念英语的广大英语学习者受益，特开发此辅助学习工具。
为保护著作权人的权益，请在使用本站前购买正版教材：
购买合法授权的新概念英语正版教材
使用官方授权的学习资源和平台
支持原创作者和教育出版社
本项目仅作为正版教材的补充学习工具
作者声明本文无利益相关，欢迎值友理性交流，和谐讨论～
