feat(rich): 安卓能编辑富文本了,图片直链换成短期签名,表格不再撑破抽屉
CI / backend (push) Canceled after 0s

三件欠账一次清:

1. 图片直链签名化
   - 新增 `backend/app/services/signing.py`:HMAC-SHA256,密钥由 `JWT_SECRET` 域分离派生
     (`attachment-raw-v1`),载荷 `workspace_id:attachment_id:exp`,默认 30 分钟
   - `/raw` 支持 `?exp=&sig=`,不需要登录态;签名里绑了工作区,跨租户链接直接拒
   - 附件对象多一个 `raw_url`,前端每次渲染现签,正文里只存不带凭据的 `/raw`
   - 保留旧 `?token=` 通道,给未升级的客户端过渡

2. 安卓富文本编辑器
   - `ui/RichTextEditorScreen.kt`:Markdown 工具栏(粗体/斜体/标题/列表/引用/代码/链接/图片),
     选区包裹与行首前缀都按光标位置来;贴图走附件接口,插入签名直链
   - 预览用 Markwon,图片用 Coil;正文落在一张白纸卡片里,不再贴屏幕边
   - 从任务详情与知识点都能进,保存按 `body_md` 回写(PATCH 带 version)

3. 表格
   - 只读渲染走 markdown-it 的 GFM 表,`display:block + overflow-x:auto`:
     宽表横向滚动、窄表铺满,都不撑破抽屉

验证:pytest 74 passed;richtext 15 / smoke 7 / tickets 8 / knowledge 7 全绿;
tsc -b 0 错;vite build 通过(主包 299.42 kB / gzip 74.96 kB);
安卓 assembleDebug 成功并在 API 35 模拟器走通编辑与预览。

仍欠:保存后回列表而非回详情抽屉、图片压缩与缩略图、HTML 片段按文本显示。
This commit is contained in:
dadao
2026-10-29 03:32:53 +08:00
parent fbdf54cb4c
commit 17be9d1d42
24 changed files with 923 additions and 99 deletions
+25 -19
View File
@@ -1,39 +1,45 @@
/**
* 附件直链的令牌处理。
* 附件直链的地址处理。
*
* 库里存的 Markdown 必须是"干净"的:只记 `/api/v1/.../attachments/<id>/raw`。
* 原因有两条——
* 1. `<img>` 发不出 Authorization 头,图片只能靠 query 里的 token 鉴权;
* 2. token 会过期。要是把它写进正文,几天后整篇文档的图片全变红叉,
* 而且团队里每个人拿到的 token 还不一样,同一个字段没法共用。
* 库里存的 Markdown 必须是"干净"的:只记 `/api/v1/.../attachments/<id>/raw`,不带任何查询串。
* 原因有三条——
* 1. `<img>` 发不出 Authorization 头,图片只能靠 URL 自身携带凭据;
* 2. 凭据会过期(令牌 30 分钟、签名也是 30 分钟),写进正文就会几天后满篇红叉;
* 3. 同一个字段在团队里要能共用,而每个人的令牌不一样。
*
* 所以规则是:**存的时候剥掉,看的时候现加**。token 永远是当前会话的。
* 所以规则是:**存的时候剥干净,看的时候现配**。
* 优先用后端在附件列表里签好的 `raw_url`(短期签名,别人拿到也只能看这一张图的一小会儿),
* 没拿到签名时才退回令牌(兼容老链接,前端已不再主动生成)。
*/
import { session } from "./client";
const UUID = "[0-9a-fA-F-]{36}";
/** 已经带上(或没带)token 的附件直链 */
const RAW_URL = new RegExp(`(/api/v1/workspaces/${UUID}/attachments/${UUID}/raw)(?:\\?token=[^)\"'\\s]*)?`, "g");
/** 附件直链:可能带 token 或 exp/sig,全部视为"要替换的查询串" */
const RAW_URL = new RegExp(`(/api/v1/workspaces/${UUID}/attachments/(${UUID})/raw)(?:\\?[^)"'\\s]*)?`, "g");
/** 附件 id → 可访问地址(后端签发的 raw_url) */
export type UrlResources = Record<string, string>;
function tokenSuffix(): string {
const token = session.access;
return token ? `?token=${encodeURIComponent(token)}` : "";
}
/** 保存前调用:把正文里所有 /raw?token=... 的令牌去掉。 */
/** 保存前调用:把正文里所有直链的查询串去掉。 */
export function stripAttachmentTokens(source: string): string {
return (source ?? "").replace(RAW_URL, (_all, url: string) => url);
}
/** 渲染或加载进编辑器前调用:给所有 /raw 链接补上当前令牌。 */
export function tokenizeAttachmentUrls(source: string): string {
const suffix = tokenSuffix();
if (!suffix) return stripAttachmentTokens(source);
return (source ?? "").replace(RAW_URL, (_all, url: string) => `${url}${suffix}`);
/** 渲染 / 装载前调用:按附件 id 换成当前可用的地址。 */
export function applyAttachmentUrls(source: string, resources?: UrlResources): string {
const fallback = tokenSuffix();
return (source ?? "").replace(RAW_URL, (_all, url: string, _ws: string, id: string) => {
const signed = resources?.[id];
if (signed) return signed;
return fallback ? `${url}${fallback}` : url;
});
}
/** 只处理 HTML 里的 img/src 与 a/href(已渲染的预览用)。 */
export function tokenizeAttachmentHtml(html: string): string {
return tokenizeAttachmentUrls(html);
}
/** 兼容旧名字:只处理 HTML(已渲染的预览用),逻辑同 applyAttachmentUrls。 */
export const tokenizeAttachmentHtml = applyAttachmentUrls;
+3 -3
View File
@@ -145,7 +145,7 @@ export async function uploadFile<T>(path: string, file: File): Promise<T> {
* 附件直链:`<img>` 带不了 Authorization 头,所以令牌走 query。
* 只在渲染 Markdown 图片时用,不要拿它去做普通的下载链接(那样 token 会留在浏览器历史里)。
*/
export function attachmentUrl(wsId: string, attachmentId: string): string {
const token = session.access ?? "";
return `${BASE}/workspaces/${wsId}/attachments/${attachmentId}/raw?token=${encodeURIComponent(token)}`;
/** 入库用的规范地址:不带任何查询串,抬头签名由渲染层按附件列表现配。 */
export function canonicalAttachmentPath(wsId: string, attachmentId: string): string {
return `${BASE}/workspaces/${wsId}/attachments/${attachmentId}/raw`;
}
+4 -4
View File
@@ -12,7 +12,7 @@
import DOMPurify from "dompurify";
import MarkdownIt from "markdown-it";
import { tokenizeAttachmentHtml } from "./attachmentUrls";
import { applyAttachmentUrls, type UrlResources } from "./attachmentUrls";
const md = new MarkdownIt({
html: false, // 不解析原始 HTML
@@ -55,13 +55,13 @@ md.renderer.rules.image = (tokens, idx, options, env, self) => {
};
/** 渲染成可直接塞进 innerHTML 的安全 HTML。 */
export function renderMarkdown(source: string): string {
export function renderMarkdown(source: string, resources?: UrlResources): string {
const safe = DOMPurify.sanitize(md.render(source ?? ""), {
// 图片走我们自己的 /raw 直链;data: 只放行图片,别的都去掉
ALLOWED_URI_REGEXP: /^(?:(?:https?|mailto):|\/|#|data:image\/)/i,
});
// 库里存的是不带令牌的直链,渲染这一层再补上(见 lib/attachmentUrls.ts)
return tokenizeAttachmentHtml(safe);
// 库里存的是干净的直链,渲染这一层按附件列表换成带签名的地址(见 lib/attachmentUrls.ts)
return applyAttachmentUrls(safe, resources);
}
/** 纯文本摘要,用于列表里的一行预览(去掉标记符号,压缩空白)。 */
+2
View File
@@ -89,6 +89,8 @@ export interface Attachment {
size: number;
uploader_id: string;
created_at: string;
/** 后端签发的短期直链(带 exp/sig),正文图片直接用它 */
raw_url?: string;
can_delete: boolean;
}