这不是一个“写个表单上传数据”的故事，而是我一个人，从头到尾搭建了一个可以离线使用、自动同步、数据持久化的移动 App。前端用 React Native，后端用 C#。整个系统支持弱网、断网下工作，联网后自动同步数据，还有一个 Web 管理后台共用同一套服务端。

你可能觉得这是团队干的活，但我一个人做下来，发现其实并不复杂，只要把结构拆清楚。

📱 前端架构：React Native + SQLite + 同步机制

前端我使用了 React Native 搭配 SQLite，整个结构保持非常明确：

• 页面层（screens）：每个业务场景（任务详情、照片上传、读数录入）一个页面，路由清晰
• 组件层（components）：输入框、拍照、按钮、状态提示等封装成可复用组件
• 模型层（models）：所有数据结构集中定义，字段命名与后端一致（snake_case）
• 服务层（services）：业务逻辑处理、校验、本地任务状态管理、离线标记等都在这里
• 数据库管理器（dbManager）：SQLite 表结构统一维护，封装所有 SQL 操作
• 同步调度器（syncScheduler）：负责离线数据打标、定时同步、冲突判断、状态更新

比如用户在任务中拍照、录入读数，这些信息直接写入 SQLite，标记为 dirty=1。之后系统定时检查网络环境，如在线则自动推送至后端接口，上传成功后清除 dirty 状态。

🌐 后端架构：ASP.NET Core Web API + EF Core + SQL Server

后端我使用 ASP.NET Core + EF Core 构建了一整套 RESTful 接口，服务于移动端同步与 Web 端管理系统。

• EF Core 管理数据库结构和数据操作，使用 Code First 模式维护模型与迁移脚本
• 接口采用统一的 device_id、local_id、last_modified 字段进行去重和同步判断
• 数据表保留 updated_at, is_deleted, synced 字段，客户端上传时使用这些字段识别差异
• Web 端系统使用同一套接口 + 鉴权机制做管理、审核、配置等操作
• 所有接口支持 token 认证与权限检查，保证数据隔离

这部分功能最初是为了移动端服务做的，但随着需求增加，Web 管理端也复用了大量后端逻辑。

🔁 离线同步机制设计

同步机制基于非常明确的数据流转逻辑：

1. 本地写入数据自动打上 dirty 标志
2. 后台定时任务每隔 X 分钟检查网络，尝试同步
3. 客户端 POST 所有 dirty 数据到服务端接口
4. 服务端对比 updated_at 判断是否接受，接受则入库并返回 synced_at
5. 客户端将成功同步的数据更新状态为 dirty=0，同时拉取服务端补丁更新覆盖本地

前端也支持手动“立即同步”按钮，方便在关键场景中主动上传。

✅ 架构亮点

• 移动端支持离线记录数据，断网时也能执行任务操作
• 后台自动同步，用户无感知
• 使用 EF Core 统一管理数据结构，方便版本维护和数据一致性
• Web 管理系统共用接口，前后端逻辑一致，复用率高
• 架构足够轻量，部署简单，日常维护压力低

🧩 技术栈

• React Native + TypeScript
• SQLite（expo-sqlite）
• ASP.NET Core Web API
• EF Core + SQL Server
• GitHub Actions（打包、自动构建 APK）
• Web 管理端（使用现成前端框架接入同一接口）

这个项目最开始只是为了解决“离线数据采集”问题，做到后来却越来越像一个完整系统。从端到端的数据同步，到接口的复用、版本管理、安全校验，都是一个人踩坑后一步步理顺的成果。

比起讲技术，我更想说的是：一个人可以写出完整系统，只要你把每一层的职责切清楚，做减法，写干净的代码就够了。