图模工坊 - 电商传图定制集成解决方案：项目简介

一句话定位

图模工坊（Printing Factory） 是一套电商传图定制集成解决方案——以”模板配置 → 用户传图 → 自动合成 → 成品交付”为主线，把打印电商最痛的素材规格不统一、多端编辑割裂、合成排版重复劳动等问题，打包成一套可私有化部署的中台。

解决一个问题：你正在做或想做”用户上传图片 → 自动套模板 → 后台批量出图”的打印电商业务，但不想从零造轮子。

它解决什么问题

传统打印电商在交付链路上的常见痛点：

素材规格五花八门：用户上传的图片尺寸、DPI、格式各异，前端不校验，后端合成时翻车
多模板批量出图重：相册、海报这类一单几十张图的场景，运营人工排版三小时，出错率高
设计师与开发互掣肘：设计师画 PSD，开发再用代码”还原”，迭代一次设计稿，开发改一次
跨端编辑割裂：手机端用户编辑、PC 端管理员审核，数据模型不一致，重复实现两套
合成 SDK 商用授权贵：Adobe SDK、Cloudinary 这类按量计费，规模一起来成本不可控

图模工坊把以上痛点整体打包：

以 Leafer 渲染引擎 + JSON sceneJson 描述模板——设计师在 pf-editor 中拖拽出版，前后端都直接消费这份 JSON；
以 Bun + Elysia + Drizzle 构建薄而快的后端 pf-service——单服务覆盖鉴权、模板、订单、文件、字体、背景库与合成调度；
以独立 pf-compose-service（Bun + Puppeteer 多 Worker 进程池）做离屏合成——把模板的 sceneJson 直接渲染成图片再自行入库 MinIO，与主服务解耦；
以 Quasar 双端复用同一份渲染层——pf-app（H5 用户端）和 pf-editor（模板编辑器）共用 Leafer + sceneJson；
以独立 pf-face-service（Rust + Axum + ONNX Runtime）做人脸框检测——证件照、写真、相册自动避脸裁剪；
以 pf-download（Wails 桌面客户端）做成品批量下载——运营在 Windows 端登录、筛单、排队下载、断点重试、离线告警。

核心价值

1. 全私有化部署。 PostgreSQL / Redis / MinIO / 人脸模型 / 合成引擎全部跑在你自己的机房，用户素材 100% 留内网，符合打印行业普遍的数据合规要求。

2. 一份 sceneJson 走天下。 模板编辑、用户编辑、后台合成、订单审核共用同一份 JSON 描述，不需要”为合成单独画一份”。

3. 工程级合成流水线。 提交主表 + 明细表 + 后台轮询 Job，用 PostgreSQL FOR UPDATE SKIP LOCKED 抢占、并发 3、失败指数退避重试；渲染下沉到独立合成微服务，单条订单几十张图也能稳定推过。

4. 移动端体验优先。 用户端 pf-app 基于 Quasar + Material Design 3，触控/拍照/相册批量上传/乐观占位/直传重试都按 H5 场景调优，非专业用户也能在手机上完成定制。

5. 图片管道边缘加速。 缩略图统一走 imgproxy 动态 WebP + Nginx 磁盘缓存（pf_img_cache / pf_raw_cache，30 天），列表瀑布流不再直连几 MB 原图。

6. 模块化能力可裁剪。 人脸检测、合成、字体库、背景库、下载客户端都是独立进程，业务方可按需启停；后端纯 TypeScript + Rust，二开门槛低。

它适合谁

角色	建议读
决策者 / 解决方案架构师	项目简介（本页）、系统架构、电商集成
产品 / 业务方	项目简介、电商集成、FAQ
后端开发	pf-service、数据模型、自动合成、合成微服务
前端开发	模板编辑器、用户端 H5、传图与裁剪
运维 / SRE	快速开始、部署拓扑、配置参考
算法 / 视觉	人脸检测服务
运营 / 交付	管理后台、下载客户端

技术栈一览

┌───────────────────────────────────────────────────────────────────┐
│  用户端     │  pf-app          (Quasar 2.23 + MD3,   端口 8000)    │
│  编辑器     │  pf-editor       (Quasar 2.23 + Leafer, 端口 8100)   │
│  管理后台   │  pf-manage       (Naive UI 2.44,        端口 9527)   │
│  下载客户端 │  pf-download     (Wails + Go + Quasar,   桌面 .exe)  │
├───────────────────────────────────────────────────────────────────┤
│  后端 API   │  pf-service      (Bun + Elysia 1.4,     端口 3000)   │
│  合成服务   │  pf-compose-service (Bun + Puppeteer,   端口 3030)   │
│  人脸检测   │  pf-face-service (Rust + Axum + ORT,     端口 3010)  │
├───────────────────────────────────────────────────────────────────┤
│  数据层     │  PostgreSQL 16+ (Drizzle ORM 0.45, postgres.js)      │
│             │  Redis 6.x   (缓存/会话)                              │
│             │  MinIO       (素材/成品 S3 兼容对象存储)              │
├───────────────────────────────────────────────────────────────────┤
│  渲染/合成  │  Leafer 2.x        (浏览器侧矢量渲染)                 │
│             │  Puppeteer 24.x    (合成服务无头 Chromium 进程池)     │
│             │  SCRFD-500M ONNX   (人脸框检测)                       │
│  图片管道   │  imgproxy (动态 WebP) + Nginx/Caddy 边缘缓存          │
└───────────────────────────────────────────────────────────────────┘

包管理器与构建：Bun 1.x 统一驱动 monorepo（apps/* + packages/*），concurrently + --filter 编排；代码规范走 oxfmt + oxlint；规范化开发流程接入 OpenSpec。

项目仓库结构

printing-factory/
├── apps/
│   ├── pf-app/             # 用户端 H5（Quasar + MD3，端口 8000）
│   ├── pf-editor/          # 模板编辑器（Quasar + Leafer，端口 8100）
│   ├── pf-manage/          # 管理后台（Naive UI / soybean-admin，端口 9527）
│   ├── pf-service/         # 后端主服务（Elysia + Drizzle + Postgres，端口 3000）
│   ├── pf-compose-service/ # 图片合成微服务（Bun + Puppeteer，端口 3030）
│   ├── pf-face-service/    # 人脸检测（Rust + Axum + ORT，端口 3010）
│   └── pf-download/        # 下载桌面客户端（Wails + Go + Quasar）
├── packages/               # 共享包（@sa/*）
│   ├── auth                # 跨端登录态 / 租户存储
│   ├── code-renderer       # 条码 / 二维码渲染（含 Leafer 节点）
│   ├── color               # 配色系统
│   ├── hooks               # Vue 组合式函数
│   ├── materials           # 后台布局组件
│   ├── uno-preset          # UnoCSS 预设
│   └── utils               # 通用工具
├── deploy/                 # 部署脚本 + docker-compose + Nginx/imgproxy 配置
├── openspec/               # OpenSpec 规范（specs / changes）
├── tools/caddy/            # 本地开发网关 Caddyfile（:9800）
├── AGENTS.md               # 工程规范
└── package.json            # Workspaces 入口

文档导航

项目概览：你在这里 → 系统架构 · 数据模型
核心应用：模板编辑器 · 用户端 H5 · 管理后台 · 后端服务 · 合成微服务 · 人脸检测 · 下载客户端
关键能力：自动合成流水线 · 传图与裁剪管线
集成与部署：电商集成方案 · 快速开始 · 部署拓扑 · 配置参考
参考资料：FAQ · 路线图

一份模板 sceneJson、一条合成流水线、七个互不阻塞的服务——把打印电商交付链路从手工劳动升级成可计量的工程产出。