fix: 完善本地与网络图片渲染

This commit is contained in:
SkyJourney
2026-07-27 22:12:16 +08:00
parent 06b30d084e
commit 32a37293d0
31 changed files with 1204 additions and 71 deletions
+18 -8
View File
@@ -16,11 +16,12 @@
- Chromium PDF 下载、精确 PDF.js 预览与导出性能观测;
- 五种纸张、页边距、页眉、页码、Mermaid 风格和浏览器配置缓存;
- 快速预览与精确预览共用的 50%~400% 显示缩放;
- 内置 Typora 风格主题,以及仅供本机使用的三套白色 Typora 默认主题导入工具
- 内置 Typora 风格、GitHub、Pixyll 和 Whitey 四套主题
- Web 素材目录上传、桌面同目录相对图片和受限公网图片下载;
- 图片标题、整块分页及超高图片单页等比例适配;
- 无本地 Server 的 Electron 桌面端与 Windows 安装包;
- 前端、Fastify、Nginx 和 Playwright Chromium 的 AIO 容器部署。
本地相对资源文件处理将在后续阶段实现。
## 本地开发
要求 Node.js 22 或更高版本。
@@ -36,7 +37,14 @@ npm run dev
- 后端:http://localhost:3001
- 健康检查:http://localhost:3001/api/health
页面支持直接编辑 Markdown,或选择本地 `.md` 文件。文件内容将读取到当前浏览器页面并发送给内网转换服务,不写入数据库。
页面支持直接编辑 Markdown,或选择本地 `.md` 文件。若 Markdown 使用
相对图片路径,再选择对应的素材目录即可;文件与图片只进入当前渲染请求,
不写入数据库。桌面端使用原生“打开 Markdown”对话框,并自动从 Markdown
所在目录安全解析相对图片。
独立一行的 `![图片标题](地址)` 会显示图片标题。图片与标题作为一个整体
参与分页;超出单页内容区时,图片会在预留标题高度后等比例缩放,不跨页
切割。远程图片会先由应用服务受限下载并内嵌,失败时显示可诊断占位。
编辑区和分页预览使用双向比例滚动同步。在任意一侧滚动时,另一侧会跟随到相同的全文阅读进度,方便定位并修改较长文档。
@@ -103,9 +111,10 @@ flowchart LR
```
````
## 本地导入 Typora 默认主题
## 内置与本地 Typora 主题
项目不会打包或提交 Typora 官方默认主题。如本机已安装 Typora,可以将 GitHub、Pixyll 和 Whitey 三套适合打印的白色默认主题及 Typora 基础 CSS 复制到 Git 忽略的本地主题目录:
公司内部版本已经内置 GitHub、Pixyll 和 Whitey 三套适合打印的白色
Typora 默认主题。如需从本机 Typora 安装目录刷新本地开发副本,可以运行:
```powershell
npm run theme:import-typora
@@ -146,5 +155,6 @@ git diff --check
## 隐私原则
文档内容仅用于当前渲染和转换请求,不接入数据库或文档历史存储。
相对资源文件支持将在后续阶段通过隔离临时目录和请求结束清理实现。
文档内容与图片仅用于当前渲染和转换请求,不接入数据库或文档历史存储。
相对路径会规范化并限制在所选目录内;路径穿越、符号链接越界、内网远程
地址、超出数量或大小上限的图片会被拒绝或替换为失败占位。