- serve manifest and service worker from the app root for install compatibility - add manifest metadata, service worker registration, and Apple touch icon links to the base template - add install icon assets for Android, iOS, and desktop install flows - document deployment and validation notes for the new PWA support - cover the new endpoints and template output with tests
This commit is contained in:
@@ -18,10 +18,29 @@
|
||||
- Box / Item / SubItem 基础 CRUD
|
||||
- Box / Item / SubItem 单图上传、替换、删除、展示
|
||||
- Box / Item / SubItem 全局搜索
|
||||
- 最小 PWA 安装支持(主屏幕 / 桌面安装)
|
||||
- Docker / Compose 长期运行
|
||||
- SQLite 数据持久化
|
||||
- 基础自动化测试
|
||||
|
||||
## PWA 安装支持
|
||||
|
||||
当前版本在不改变 FastAPI + Jinja2 SSR 结构的前提下,补充了最小可维护的 PWA 能力:
|
||||
|
||||
- 提供根路径 `manifest.webmanifest`
|
||||
- 提供根路径 `service-worker.js`
|
||||
- 在基础模板中注入 `manifest`、`theme-color`、`apple-touch-icon` 和安装相关 meta
|
||||
- 支持 Android Chrome 添加到主屏幕
|
||||
- 支持 iPhone Safari 添加到主屏幕
|
||||
- 支持桌面 Chrome / Edge 安装为独立 app 窗口
|
||||
|
||||
当前新增的安装图标尺寸:
|
||||
|
||||
- `180x180`:Apple touch icon
|
||||
- `192x192`:Android / Chromium 安装图标
|
||||
- `512x512`:高分辨率安装图标
|
||||
- `512x512`:maskable 图标
|
||||
|
||||
## 当前数据模型
|
||||
|
||||
这个项目不是无限树结构,而是固定最多 3 级:
|
||||
@@ -110,6 +129,9 @@ Box
|
||||
|
||||
这一阶段仍然没有实现以下内容:
|
||||
|
||||
- 离线访问
|
||||
- 离线缓存策略
|
||||
- 离线数据同步
|
||||
- 多图上传
|
||||
- OCR
|
||||
- AI 识别物品
|
||||
@@ -223,6 +245,22 @@ uvicorn app.main:app --reload --host 0.0.0.0 --port 10000
|
||||
http://localhost:10000
|
||||
```
|
||||
|
||||
本地开发验证 PWA 时,页面与安装元数据可以直接检查;如果要完整验证桌面安装体验,优先在 HTTPS 或受信任反向代理环境下测试。
|
||||
|
||||
## PWA 部署注意事项
|
||||
|
||||
- 生产环境应使用 HTTPS;Android Chrome 和桌面 Chrome / Edge 的安装能力通常要求安全上下文
|
||||
- `manifest.webmanifest` 需要返回 `application/manifest+json`
|
||||
- `service-worker.js` 需要从站点根路径返回,保证作用域覆盖整个应用
|
||||
- 如果前面有 nginx 或其他反向代理,不要拦截或改写这两个根路径资源
|
||||
- iPhone Safari 的“添加到主屏幕”主要依赖 meta 和 `apple-touch-icon`,不包含离线能力
|
||||
|
||||
## PWA 简单验收
|
||||
|
||||
1. Android Chrome:打开站点,确认浏览器菜单或地址栏出现“添加到主屏幕”或“安装应用”。
|
||||
2. iPhone Safari:打开站点,点击分享菜单,确认可见“添加到主屏幕”。
|
||||
3. Desktop Chrome / Edge:打开站点,确认地址栏或菜单中出现“安装应用”。
|
||||
|
||||
本地默认数据库位置:
|
||||
|
||||
```text
|
||||
|
||||
Reference in New Issue
Block a user