diff --git a/frontend/src/app/pages/SharePage.tsx b/frontend/src/app/pages/SharePage.tsx index 621a05c..20cf180 100644 --- a/frontend/src/app/pages/SharePage.tsx +++ b/frontend/src/app/pages/SharePage.tsx @@ -33,9 +33,9 @@ function supportsWxMiniProgramShare(): boolean { } catch { return false; } } - -/** 模块级状态:避免构建压缩时变量名不一致导致 ReferenceError */ -const _wp = { url: null as string | null, tick: 0 }; + +/** 模块级状态:避免构建压缩时变量名不一致导致 ReferenceError */ +const _wp = { url: null as string | null, tick: 0 }; export function SharePage() { const navigate = useNavigate(); const { reportId } = useParams(); @@ -137,15 +137,20 @@ export function SharePage() { try { // html-to-image: 将 DOM 节点转为 PNG data URL - const dataUrl = await toPng(cardRef.current, { - cacheBust: true, - pixelRatio: 2, // 2x 高清 - backgroundColor: "#ffffff", - style: { - // 确保截图时移除圆角阴影的裁切问题 - borderRadius: "0", - }, - }); + // 注意:不能用 cacheBust,会破坏 blob: URL + const dataUrl = await Promise.race([ + toPng(cardRef.current, { + pixelRatio: 2, // 2x 高清 + backgroundColor: "#ffffff", + style: { + // 确保截图时移除圆角阴影的裁切问题 + borderRadius: "0", + }, + }), + new Promise((_, reject) => + setTimeout(() => reject(new Error("截图超时")), 10000) + ), + ]); return dataUrl; } catch (err) { console.error("生成图片失败:", err); @@ -675,6 +680,9 @@ function ShareCardContent({ textAlign: "center", paddingTop: "20px", borderTop: "1px dashed #e5e7eb", + display: "flex", + flexDirection: "column", + alignItems: "center", }} >