Compare commits
4
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 QihuAI Design
|
7674729804 | ||
|
QihuAI Design
|
11b80b90f4 | ||
|
QihuAI Design
|
71a6403e5b | ||
|
QihuAI Design
|
5def2697de |
No files matched your search
@@ -1430,7 +1430,7 @@ async def _generate_media_task(ai_msg_id: str, ai_model_id: str, prompt: str, us
|
||||
logger.info(f"[_generate_media_task] 启动 media 生成 msg={ai_msg_id} model={ai_model_id} prompt={prompt[:60]!r}")
|
||||
caps = [c.lower() for c in (ai_model.capabilities or [])]
|
||||
is_video = "video" in caps
|
||||
timeout_seconds = 300 if is_video else 90
|
||||
timeout_seconds = 300 if is_video else 180
|
||||
try:
|
||||
result = await asyncio.wait_for(
|
||||
_generate_media(db, ai_model, prompt, user_id),
|
||||
|
||||
@@ -1657,6 +1657,16 @@ async def _send_message_core(
|
||||
|
||||
|
||||
|
||||
# 媒体分支直接返回，不会进入 LLM 工具调用；提前初始化避免未绑定
|
||||
|
||||
called_skill_names = []
|
||||
|
||||
|
||||
|
||||
called_mcp_names = []
|
||||
|
||||
|
||||
|
||||
if effective_skill_ids:
|
||||
|
||||
|
||||
|
||||
@@ -128,7 +128,15 @@ def setup_file_logging():
|
||||
root_logger.setLevel(logging.INFO)
|
||||
root_logger.addHandler(app_handler)
|
||||
root_logger.addHandler(error_handler)
|
||||
root_logger.addFilter(TraceIdFilter())
|
||||
|
||||
# TraceIdFilter 必须挂在 handler 上，而非 root logger。
|
||||
# logger 级 filter 只对「直接经该 logger 发射」的记录生效；子 logger 的记录向上冒泡
|
||||
# 到 root 的 handler 时不会经过 root 的 logger 级 filter，导致 %(trace_id)s 缺失并抛
|
||||
# KeyError('trace_id')。handler 级 filter 对经它格式化的每条记录都生效。
|
||||
_tid_filter = TraceIdFilter()
|
||||
app_handler.addFilter(_tid_filter)
|
||||
error_handler.addFilter(_tid_filter)
|
||||
access_handler.addFilter(_tid_filter)
|
||||
|
||||
# 配置访问日志专用logger
|
||||
access_logger = logging.getLogger("aiflow.access")
|
||||
|
||||
@@ -945,7 +945,7 @@ class SkillTrajectoryLink(Base):
|
||||
skill_name = Column(String(200), nullable=False, index=True, comment="关联的技能名称")
|
||||
user_id = Column(String(36), ForeignKey("users.id"), nullable=False, index=True)
|
||||
trajectory_id = Column(String(36), nullable=True, comment="关联的轨迹ID")
|
||||
atom_id = Column(String(36), nullable=True, comment="原子任务ID")
|
||||
atom_id = Column(String(128), nullable=True, comment="原子任务ID(形如 trajectory_id_atom_N，需容纳 UUID+后缀)")
|
||||
weightscore = Column(Integer, default=0, comment="关联权重分")
|
||||
created_at = Column(DateTime, default=datetime.now)
|
||||
|
||||
|
||||
@@ -96,10 +96,24 @@ class PipelineScheduler:
|
||||
self._process_trajectory(db, traj)
|
||||
except Exception as e:
|
||||
logger.error(f"处理轨迹 {traj.id} 失败: {e}")
|
||||
traj.error_msg = str(e)[:500]
|
||||
traj.retry_count = (traj.retry_count or 0) + 1
|
||||
traj.status = "error"
|
||||
db.commit()
|
||||
# 先回滚失效事务（_process_trajectory 内 commit 失败会让 session
|
||||
# 进入 rolled-back 状态，不回滚直接再 commit 会抛 PendingRollbackError
|
||||
# 并级联到外层日志），再写错误状态。
|
||||
try:
|
||||
db.rollback()
|
||||
except Exception:
|
||||
pass
|
||||
try:
|
||||
traj.error_msg = str(e)[:500]
|
||||
traj.retry_count = (traj.retry_count or 0) + 1
|
||||
traj.status = "error"
|
||||
db.commit()
|
||||
except Exception as ce:
|
||||
logger.error(f"更新轨迹 {traj.id} 错误状态失败: {ce}")
|
||||
try:
|
||||
db.rollback()
|
||||
except Exception:
|
||||
pass
|
||||
finally:
|
||||
db.close()
|
||||
except Exception as e:
|
||||
|
||||
@@ -471,10 +471,15 @@
|
||||
}
|
||||
|
||||
.md-table td {
|
||||
padding: 10px 14px;
|
||||
padding: 8px 12px;
|
||||
border-bottom: 1px solid #EEF0F4;
|
||||
color: var(--color-text-primary);
|
||||
vertical-align: top;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.md-table td br {
|
||||
line-height: 0.8;
|
||||
}
|
||||
|
||||
.md-table tbody tr:last-child td {
|
||||
|
||||
@@ -6,9 +6,7 @@ import type { Conversation, Message } from '@/types';
|
||||
import './ChatPage.css';
|
||||
|
||||
// ===== 增强渲染依赖 =====
|
||||
import hljs from 'highlight.js';
|
||||
import 'highlight.js/styles/github.css';
|
||||
import katex from 'katex';
|
||||
import 'katex/dist/katex.min.css';
|
||||
import mermaid from 'mermaid';
|
||||
|
||||
@@ -16,7 +14,7 @@ mermaid.initialize({ startOnLoad: false, theme: 'default' });
|
||||
|
||||
// ===== Enhanced Markdown Renderer =====
|
||||
// 媒体(图片/视频)以受限缩略图呈现，并提供下载(格式+尺寸)选项
|
||||
interface MediaInfo { type: 'img' | 'video'; src: string; alt?: string; }
|
||||
import { renderMarkdownToHtml, MediaInfo } from '@/utils/markdown';
|
||||
|
||||
// 全屏灯箱预览
|
||||
const ChatLightbox: React.FC<{ src: string; type: 'img' | 'video'; onClose: () => void }> = ({ src, type, onClose }) => {
|
||||
@@ -154,172 +152,17 @@ const ChatMedia: React.FC<{ info: MediaInfo }> = ({ info }) => {
|
||||
};
|
||||
|
||||
const MarkdownContent: React.FC<{ content: string }> = ({ content }) => {
|
||||
// 渲染管线（代码块/加粗/表格/换行/媒体占位符等）已抽到 src/utils/markdown.ts，
|
||||
// 组件只负责把返回的 html 切分为「文本片段 + 媒体组件」。
|
||||
const { html, media } = useMemo(() => renderMarkdownToHtml(content), [content]);
|
||||
|
||||
const nodes = useMemo(() => {
|
||||
let text = content;
|
||||
|
||||
// 1. Extract code blocks first (protect from other replacements)
|
||||
const codeBlocks: string[] = [];
|
||||
const mermaidBlocks: string[] = [];
|
||||
text = text.replace(/```(\w*)\n?([\s\S]*?)```/g, (_m: string, _lang: string, code: string) => {
|
||||
if (_lang === 'mermaid') {
|
||||
const idx = mermaidBlocks.length;
|
||||
mermaidBlocks.push('<div class="md-mermaid" data-code="' + escapeHtml(code.trim()) + '"></div>');
|
||||
return '\x00MERMAID' + idx + '\x00';
|
||||
}
|
||||
const idx = codeBlocks.length;
|
||||
codeBlocks.push('<pre class="md-code-block"><code class="md-code">' + escapeHtml(code.trim()) + '</code></pre>');
|
||||
return '\x00CODEBLOCK' + idx + '\x00';
|
||||
});
|
||||
|
||||
// 2. Extract inline code
|
||||
const inlineCodes: string[] = [];
|
||||
text = text.replace(/`([^`]+)`/g, (_m: string, code: string) => {
|
||||
const idx = inlineCodes.length;
|
||||
inlineCodes.push('<code class="md-inline-code">' + escapeHtml(code) + '</code>');
|
||||
return '\x00INLINE' + idx + '\x00';
|
||||
});
|
||||
|
||||
// 2.5 Extract media blocks (<img>/<video>) → 结构化，后续渲染为 React 组件
|
||||
const mediaBlocks: MediaInfo[] = [];
|
||||
text = text.replace(/<(img|video)([^>]*?)\/?>/gi, (_m: string, tag: string, attrs: string) => {
|
||||
const type = tag.toLowerCase() === 'img' ? 'img' : 'video';
|
||||
const srcM = attrs.match(/src=["']([^"']+)["']/i);
|
||||
const altM = attrs.match(/alt=["']([^"']*)["']/i);
|
||||
mediaBlocks.push({ type, src: srcM ? srcM[1] : '', alt: altM ? altM[1] : '' });
|
||||
return '\x00MEDIA' + (mediaBlocks.length - 1) + '\x00';
|
||||
});
|
||||
|
||||
// 2.7 Extract Markdown tables: | h1 | h2 |\n|---|---| ... |
|
||||
// 把整段表格替换为占位符，表格内容(已转义)放入 tableBlocks 数组
|
||||
const tableBlocks: string[] = [];
|
||||
text = text.replace(
|
||||
/((?:^\|.+\|\r?\n)+^\|[\s\-:|]+\|\r?\n(?:^\|.+\|\r?\n?)+)/gm,
|
||||
(_m: string, block: string) => {
|
||||
const lines = block.trim().split(/\r?\n/).filter((l: string) => l.trim());
|
||||
if (lines.length < 2) return block;
|
||||
const headerCells = lines[0].split('|').slice(1, -1).map((c: string) => c.trim());
|
||||
const alignCells = lines[1].split('|').slice(1, -1).map((c: string) => {
|
||||
const t = c.trim();
|
||||
const left = t.startsWith(':');
|
||||
const right = t.endsWith(':');
|
||||
if (left && right) return 'center';
|
||||
if (right) return 'right';
|
||||
if (left) return 'left';
|
||||
return 'left';
|
||||
});
|
||||
const bodyRows = lines.slice(2).map((row: string) =>
|
||||
row.split('|').slice(1, -1).map((c: string) => c.trim())
|
||||
);
|
||||
const thead = headerCells.map((c: string, i: number) =>
|
||||
`<th style="text-align:${alignCells[i] || 'left'}">${c}</th>`
|
||||
).join('');
|
||||
const tbody = bodyRows.map((r: string[]) =>
|
||||
'<tr>' + r.map((c: string, i: number) =>
|
||||
`<td style="text-align:${alignCells[i] || 'left'}">${c}</td>`
|
||||
).join('') + '</tr>'
|
||||
).join('');
|
||||
const html = `<table class="md-table"><thead><tr>${thead}</tr></thead><tbody>${tbody}</tbody></table>`;
|
||||
const idx = tableBlocks.length;
|
||||
tableBlocks.push(html);
|
||||
return '\x00TABLE' + idx + '\x00';
|
||||
}
|
||||
);
|
||||
|
||||
// 2.8 LaTeX 数学公式：$$...$$（块级）和 $...$（行内）
|
||||
// 提取为占位符，渲染后用 KaTeX 处理
|
||||
const mathBlocks: string[] = [];
|
||||
text = text.replace(/\$\$([\s\S]+?)\$\$/g, (_m: string, formula: string) => {
|
||||
try {
|
||||
const rendered = katex.renderToString(formula.trim(), { displayMode: true, throwOnError: false });
|
||||
const idx = mathBlocks.length;
|
||||
mathBlocks.push(`<div class="md-math-block">${rendered}</div>`);
|
||||
return '\x00MATHBLOCK' + idx + '\x00';
|
||||
} catch { return _m; }
|
||||
});
|
||||
text = text.replace(/\$([^\s$][^$]*[^\s$])\$/g, (_m: string, formula: string) => {
|
||||
try {
|
||||
const rendered = katex.renderToString(formula.trim(), { displayMode: false, throwOnError: false });
|
||||
const idx = mathBlocks.length;
|
||||
mathBlocks.push(`<span class="md-math-inline">${rendered}</span>`);
|
||||
return '\x00MATHBLOCK' + idx + '\x00';
|
||||
} catch { return _m; }
|
||||
});
|
||||
|
||||
// 2.9 Strikethrough: ~~text~~ → <del>text</del>
|
||||
text = text.replace(/~~(.+?)~~/g, '<del>$1</del>');
|
||||
|
||||
// 2.10 Auto-link bare URLs: http(s)://... → <a>
|
||||
text = text.replace(/(?<![="'>])https?:\/\/[^\s<>[\]()]+/g, (url: string) =>
|
||||
`<a class="md-link" href="${url}" target="_blank" rel="noopener">${url}</a>`
|
||||
);
|
||||
|
||||
// 3. Headers
|
||||
text = text.replace(/^#### (.+)$/gm, '<h4 class="md-h4">$1</h4>');
|
||||
text = text.replace(/^### (.+)$/gm, '<h4 class="md-h4">$1</h4>');
|
||||
text = text.replace(/^## (.+)$/gm, '<h3 class="md-h3">$1</h3>');
|
||||
text = text.replace(/^# (.+)$/gm, '<h2 class="md-h2">$1</h2>');
|
||||
|
||||
// 4. Horizontal rule
|
||||
text = text.replace(/^---+$/gm, '<hr class="md-hr">');
|
||||
|
||||
// 5. Blockquotes
|
||||
text = text.replace(/^> (.+)$/gm, '<blockquote class="md-blockquote">$1</blockquote>');
|
||||
|
||||
// 6. Links [text](url)
|
||||
text = text.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a class="md-link" href="$2" target="_blank" rel="noopener">$1</a>');
|
||||
|
||||
// 7. Bold and italic
|
||||
text = text.replace(/\*\*\*(.+?)\*\*\*/g, '<strong><em>$1</em></strong>');
|
||||
text = text.replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>');
|
||||
text = text.replace(/(?<!\w)\*(?!\*)(.+?)(?<!\*)\*(?!\w)/g, '<em>$1</em>');
|
||||
|
||||
// 8. Lists
|
||||
text = text.replace(/^\s*[-*] (.+)$/gm, '<li class="md-li">$1</li>');
|
||||
text = text.replace(/^\s*\d+\. (.+)$/gm, '<li class="md-li">$1</li>');
|
||||
// Wrap consecutive <li> in <ul>
|
||||
text = text.replace(/((?:<li class="md-li">[\s\S]*?<\/li>\n?)+)/g, '<ul class="md-ul">$1</ul>');
|
||||
|
||||
// 9. Convert double newlines to paragraph breaks, single to <br/>
|
||||
text = text.replace(/\n\n/g, '</p><p class="md-p">');
|
||||
text = text.replace(/\n/g, '<br/>');
|
||||
|
||||
// 10. Restore code blocks and inline codes
|
||||
text = text.replace(/\x00CODEBLOCK(\d+)\x00/g, (_m: string, idx: string) => codeBlocks[parseInt(idx)] || '');
|
||||
text = text.replace(/\x00MERMAID(\d+)\x00/g, (_m: string, idx: string) => mermaidBlocks[parseInt(idx)] || '');
|
||||
text = text.replace(/\x00INLINE(\d+)\x00/g, (_m: string, idx: string) => inlineCodes[parseInt(idx)] || '');
|
||||
text = text.replace(/\x00TABLE(\d+)\x00/g, (_m: string, idx: string) => tableBlocks[parseInt(idx)] || '');
|
||||
text = text.replace(/\x00MATHBLOCK(\d+)\x00/g, (_m: string, idx: string) => mathBlocks[parseInt(idx)] || '');
|
||||
|
||||
// 10.5 Apply syntax highlighting to code blocks + add copy button
|
||||
text = text.replace(
|
||||
/<pre class="md-code-block"><code class="md-code">([\s\S]*?)<\/code><\/pre>/g,
|
||||
(_m: string, code: string) => {
|
||||
const decoded = code.replace(/</g, '<').replace(/>/g, '>').replace(/&/g, '&');
|
||||
let highlighted: string;
|
||||
try { highlighted = hljs.highlightAuto(decoded).value; } catch { highlighted = code; }
|
||||
return `<div class="md-code-wrapper">
|
||||
<button class="md-code-copy" onclick="navigator.clipboard.writeText(this.parentElement.querySelector('code').textContent);this.textContent='已复制';setTimeout(()=>this.textContent='复制',2000)">复制</button>
|
||||
<pre class="md-code-block"><code class="md-code hljs">${highlighted}</code></pre>
|
||||
</div>`;
|
||||
}
|
||||
);
|
||||
|
||||
// 11. Wrap in paragraph and clean up
|
||||
text = '<p class="md-p">' + text + '</p>';
|
||||
text = text.replace(/<p class="md-p"><\/p>/g, '');
|
||||
text = text.replace(/<p class="md-p">(<h[234][\s\S]*?<\/h[234]>)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<pre[\s\S]*?<\/pre>)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<ul[\s\S]*?<\/ul>)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<hr[\s\S]*?)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<blockquote[\s\S]*?<\/blockquote>)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<table[\s\S]*?<\/table>)<\/p>/g, '$1');
|
||||
|
||||
// 12. 拆分为文本片段与媒体组件
|
||||
const parts = text.split(/(\x00MEDIA\d+\x00)/g);
|
||||
// 12. 拆分为文本片段与媒体组件（媒体以 \x00MEDIA<n>\x00 占位符保留在 html 中）
|
||||
const parts = html.split(/(\x00MEDIA\d+\x00)/g);
|
||||
return parts.map((part: string, i: number) => {
|
||||
const m = part.match(/^\x00MEDIA(\d+)\x00$/);
|
||||
if (m) {
|
||||
const info = mediaBlocks[parseInt(m[1])];
|
||||
const info = media[parseInt(m[1])];
|
||||
if (info && info.src) return <ChatMedia key={'m' + i} info={info} />;
|
||||
return null;
|
||||
}
|
||||
@@ -329,7 +172,7 @@ const MarkdownContent: React.FC<{ content: string }> = ({ content }) => {
|
||||
if (!s.trim()) return null;
|
||||
return <div key={'t' + i} className="md-text-seg" dangerouslySetInnerHTML={{ __html: s }} />;
|
||||
});
|
||||
}, [content]);
|
||||
}, [html, media]);
|
||||
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
useEffect(() => {
|
||||
@@ -387,14 +230,6 @@ const ClarifyCard: React.FC<{ data: { prompt: string; options: any[] }; onChoose
|
||||
};
|
||||
|
||||
|
||||
function escapeHtml(text: string): string {
|
||||
return text
|
||||
.replace(/&/g, '&')
|
||||
.replace(/</g, '<')
|
||||
.replace(/>/g, '>')
|
||||
.replace(/"/g, '"');
|
||||
}
|
||||
|
||||
// ===== Time Formatting =====
|
||||
function formatTime(iso: string): string {
|
||||
return formatChatTime(iso);
|
||||
|
||||
@@ -0,0 +1,80 @@
|
||||
import { describe, it, expect } from 'vitest';
|
||||
import { renderMarkdownToHtml } from './markdown';
|
||||
|
||||
// 前台聊天 Markdown 渲染曾两次被 bug 击穿：
|
||||
// 1) 段落内单个 \n 被转成 <br/>，导致 AI 回复被强制大量换行、内容撑成多行；
|
||||
// 2) 表格在加粗/链接转换之前被提取，单元格内 **xxx** 原样显示、且 <br> 未压缩。
|
||||
// 本测试固化「渲染管线」契约，防止回归。管线代码见 ./markdown.ts（从 ChatPage 抽出）。
|
||||
describe('renderMarkdownToHtml', () => {
|
||||
it('段落内单个 \\n 转为空格（而非 <br/>）', () => {
|
||||
const { html } = renderMarkdownToHtml('第一行\n第二行');
|
||||
expect(html).not.toContain('<br');
|
||||
expect(html).toContain('第一行 第二行');
|
||||
});
|
||||
|
||||
it('双换行转为段落分隔', () => {
|
||||
const { html } = renderMarkdownToHtml('段一\n\n段二');
|
||||
expect(html).toContain('段一</p><p class="md-p">段二');
|
||||
});
|
||||
|
||||
it('3+ 连续空行压缩为 2 个（与 2 个空行结果一致）', () => {
|
||||
const many = renderMarkdownToHtml('a\n\n\n\n\nb').html;
|
||||
const few = renderMarkdownToHtml('a\n\nb').html;
|
||||
expect(many).toBe(few);
|
||||
expect(many).toContain('a</p><p class="md-p">b');
|
||||
});
|
||||
|
||||
it('表格在加粗之后提取，单元格内的 **xxx** 被渲染为 <strong>', () => {
|
||||
const input = '| 能力 | 说明 |\n| --- | --- |\n| **渠道排序** | 按优先级 |\n';
|
||||
const { html } = renderMarkdownToHtml(input);
|
||||
expect(html).toContain('<table class="md-table">');
|
||||
expect(html).toContain('<th');
|
||||
expect(html).toContain('<td');
|
||||
expect(html).toContain('<strong>渠道排序</strong>');
|
||||
});
|
||||
|
||||
it('单元格内连续 <br> 被压缩为单个', () => {
|
||||
const input = '| 列 |\n| --- |\n| a<br/><br/>b |\n';
|
||||
const { html } = renderMarkdownToHtml(input);
|
||||
expect(html).toContain('a<br/>b');
|
||||
expect(html).not.toContain('<br/><br/>');
|
||||
});
|
||||
|
||||
it('无序列表渲染为 <ul><li>', () => {
|
||||
const { html } = renderMarkdownToHtml('- a\n- b');
|
||||
expect(html).toContain('<ul class="md-ul">');
|
||||
expect(html).toContain('<li class="md-li">a</li>');
|
||||
expect(html).toContain('<li class="md-li">b</li>');
|
||||
});
|
||||
|
||||
it('一级标题渲染为 h2', () => {
|
||||
const { html } = renderMarkdownToHtml('# Title');
|
||||
expect(html).toContain('<h2 class="md-h2">Title</h2>');
|
||||
});
|
||||
|
||||
it('代码块内容不被行内加粗转换', () => {
|
||||
const { html } = renderMarkdownToHtml('```\n**not bold**\n```');
|
||||
expect(html).toContain('<pre class="md-code-block">');
|
||||
expect(html).not.toContain('<strong>not bold</strong>');
|
||||
});
|
||||
|
||||
it('行内代码被抽取保护', () => {
|
||||
const { html } = renderMarkdownToHtml('use `npm run` here');
|
||||
expect(html).toContain('<code class="md-inline-code">npm run</code>');
|
||||
});
|
||||
|
||||
it('[文本](url) 链接渲染', () => {
|
||||
const { html } = renderMarkdownToHtml('[Google](https://g.com)');
|
||||
expect(html).toContain('<a class="md-link" href="https://g.com"');
|
||||
expect(html).toContain('Google');
|
||||
});
|
||||
|
||||
it('媒体(<img>)以占位符保留并返回结构化 media 列表', () => {
|
||||
const { html, media } = renderMarkdownToHtml('看这张图 <img src="https://x.com/a.png" alt="图">');
|
||||
expect(media.length).toBe(1);
|
||||
expect(media[0].type).toBe('img');
|
||||
expect(media[0].src).toBe('https://x.com/a.png');
|
||||
expect(media[0].alt).toBe('图');
|
||||
expect(html).toContain('\x00MEDIA0\x00');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,205 @@
|
||||
import katex from 'katex';
|
||||
import hljs from 'highlight.js';
|
||||
|
||||
export interface MediaInfo {
|
||||
type: 'img' | 'video';
|
||||
src: string;
|
||||
alt?: string;
|
||||
}
|
||||
|
||||
export interface RenderResult {
|
||||
html: string;
|
||||
media: MediaInfo[];
|
||||
}
|
||||
|
||||
function escapeHtml(text: string): string {
|
||||
return text
|
||||
.replace(/&/g, '&')
|
||||
.replace(/</g, '<')
|
||||
.replace(/>/g, '>')
|
||||
.replace(/"/g, '"');
|
||||
}
|
||||
|
||||
/**
|
||||
* 将 Markdown 文本转为带占位符的 HTML 字符串。
|
||||
*
|
||||
* 设计契约（曾被线上 bug 击穿、用单测固化，见 markdown.test.ts）：
|
||||
* - 段落内【单个 \n 转为空格】而非 <br/>，避免 AI 回复被强制大量换行；
|
||||
* - 【3+ 连续空行压缩为 2 个】（/\n{3,}/ -> \n\n），避免多余空白把内容撑成多行；
|
||||
* - 【表格在加粗/链接转换之后提取】，单元格内的 **xxx** / [文本](url) 才能被渲染；
|
||||
* 且单元格内连续 <br> 被压缩为单个（normalizeCell）。
|
||||
*
|
||||
* 媒体(<img>/<video>)以 \x00MEDIA<n>\x00 占位符保留在返回的 html 中，
|
||||
* 由调用方（ChatPage 的 MarkdownContent）切分后渲染为 React 组件。
|
||||
*/
|
||||
export function renderMarkdownToHtml(content: string): RenderResult {
|
||||
let text = content;
|
||||
|
||||
// 1. Extract code blocks first (protect from other replacements)
|
||||
const codeBlocks: string[] = [];
|
||||
const mermaidBlocks: string[] = [];
|
||||
text = text.replace(/```(\w*)\n?([\s\S]*?)```/g, (_m: string, _lang: string, code: string) => {
|
||||
if (_lang === 'mermaid') {
|
||||
const idx = mermaidBlocks.length;
|
||||
mermaidBlocks.push('<div class="md-mermaid" data-code="' + escapeHtml(code.trim()) + '"></div>');
|
||||
return '\x00MERMAID' + idx + '\x00';
|
||||
}
|
||||
const idx = codeBlocks.length;
|
||||
codeBlocks.push('<pre class="md-code-block"><code class="md-code">' + escapeHtml(code.trim()) + '</code></pre>');
|
||||
return '\x00CODEBLOCK' + idx + '\x00';
|
||||
});
|
||||
|
||||
// 2. Extract inline code
|
||||
const inlineCodes: string[] = [];
|
||||
text = text.replace(/`([^`]+)`/g, (_m: string, code: string) => {
|
||||
const idx = inlineCodes.length;
|
||||
inlineCodes.push('<code class="md-inline-code">' + escapeHtml(code) + '</code>');
|
||||
return '\x00INLINE' + idx + '\x00';
|
||||
});
|
||||
|
||||
// 2.5 Extract media blocks (<img>/<video>) -> 结构化，后续渲染为 React 组件
|
||||
const mediaBlocks: MediaInfo[] = [];
|
||||
text = text.replace(/<(img|video)([^>]*?)\/?>/gi, (_m: string, tag: string, attrs: string) => {
|
||||
const type = tag.toLowerCase() === 'img' ? 'img' : 'video';
|
||||
const srcM = attrs.match(/src=["']([^"']+)["']/i);
|
||||
const altM = attrs.match(/alt=["']([^"']*)["']/i);
|
||||
mediaBlocks.push({ type, src: srcM ? srcM[1] : '', alt: altM ? altM[1] : '' });
|
||||
return '\x00MEDIA' + (mediaBlocks.length - 1) + '\x00';
|
||||
});
|
||||
|
||||
// 2.6 Normalize excessive blank lines in prose (code blocks already extracted)
|
||||
text = text.replace(/\n{3,}/g, '\n\n').trim();
|
||||
|
||||
// 2.8 LaTeX 数学公式：$$...$$（块级）和 $...$（行内）
|
||||
const mathBlocks: string[] = [];
|
||||
text = text.replace(/\$\$([\s\S]+?)\$\$/g, (_m: string, formula: string) => {
|
||||
try {
|
||||
const rendered = katex.renderToString(formula.trim(), { displayMode: true, throwOnError: false });
|
||||
const idx = mathBlocks.length;
|
||||
mathBlocks.push(`<div class="md-math-block">${rendered}</div>`);
|
||||
return '\x00MATHBLOCK' + idx + '\x00';
|
||||
} catch { return _m; }
|
||||
});
|
||||
text = text.replace(/\$([^\s$][^$]*[^\s$])\$/g, (_m: string, formula: string) => {
|
||||
try {
|
||||
const rendered = katex.renderToString(formula.trim(), { displayMode: false, throwOnError: false });
|
||||
const idx = mathBlocks.length;
|
||||
mathBlocks.push(`<span class="md-math-inline">${rendered}</span>`);
|
||||
return '\x00MATHBLOCK' + idx + '\x00';
|
||||
} catch { return _m; }
|
||||
});
|
||||
|
||||
// 2.9 Strikethrough: ~~text~~ -> <del>text</del>
|
||||
text = text.replace(/~~(.+?)~~/g, '<del>$1</del>');
|
||||
|
||||
// 2.10 Auto-link bare URLs: http(s)://... -> <a>
|
||||
text = text.replace(/(?<![="'>])https?:\/\/[^\s<>[\]()]+/g, (url: string) =>
|
||||
`<a class="md-link" href="${url}" target="_blank" rel="noopener">${url}</a>`
|
||||
);
|
||||
|
||||
// 3. Headers
|
||||
text = text.replace(/^#### (.+)$/gm, '<h4 class="md-h4">$1</h4>');
|
||||
text = text.replace(/^### (.+)$/gm, '<h4 class="md-h4">$1</h4>');
|
||||
text = text.replace(/^## (.+)$/gm, '<h3 class="md-h3">$1</h3>');
|
||||
text = text.replace(/^# (.+)$/gm, '<h2 class="md-h2">$1</h2>');
|
||||
|
||||
// 4. Horizontal rule
|
||||
text = text.replace(/^---+$/gm, '<hr class="md-hr">');
|
||||
|
||||
// 5. Blockquotes
|
||||
text = text.replace(/^> (.+)$/gm, '<blockquote class="md-blockquote">$1</blockquote>');
|
||||
|
||||
// 6. Links [text](url)
|
||||
text = text.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a class="md-link" href="$2" target="_blank" rel="noopener">$1</a>');
|
||||
|
||||
// 7. Bold and italic
|
||||
text = text.replace(/\*\*\*(.+?)\*\*\*/g, '<strong><em>$1</em></strong>');
|
||||
text = text.replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>');
|
||||
text = text.replace(/(?<!\w)\*(?!\*)(.+?)(?<!\*)\*(?!\w)/g, '<em>$1</em>');
|
||||
|
||||
// 7.5 Extract Markdown tables after inline formatting so cells support bold/italic/links.
|
||||
// 表格提取放在加粗/链接之后，避免单元格内 **xxx** 原样显示；同时压缩单元格内多余 <br>。
|
||||
const tableBlocks: string[] = [];
|
||||
text = text.replace(
|
||||
/((?:^\|.+\|\r?\n)+^\|[\s\-:|]+\|\r?\n(?:^\|.+\|\r?\n?)+)/gm,
|
||||
(_m: string, block: string) => {
|
||||
const lines = block.trim().split(/\r?\n/).filter((l: string) => l.trim());
|
||||
if (lines.length < 2) return block;
|
||||
const headerCells = lines[0].split('|').slice(1, -1).map((c: string) => c.trim());
|
||||
const alignCells = lines[1].split('|').slice(1, -1).map((c: string) => {
|
||||
const t = c.trim();
|
||||
const left = t.startsWith(':');
|
||||
const right = t.endsWith(':');
|
||||
if (left && right) return 'center';
|
||||
if (right) return 'right';
|
||||
if (left) return 'left';
|
||||
return 'left';
|
||||
});
|
||||
const normalizeCell = (cell: string) => {
|
||||
return cell
|
||||
.replace(/<br\s*\/?>\s*/gi, '<br/>')
|
||||
.replace(/\n/g, '<br/>')
|
||||
.replace(/(<br\/>){2,}/g, '<br/>')
|
||||
.replace(/^(<br\/>)+|(<br\/>)+$/g, '');
|
||||
};
|
||||
const bodyRows = lines.slice(2).map((row: string) =>
|
||||
row.split('|').slice(1, -1).map((c: string) => normalizeCell(c.trim()))
|
||||
);
|
||||
const thead = headerCells.map((c: string, i: number) =>
|
||||
`<th style="text-align:${alignCells[i] || 'left'}">${normalizeCell(c)}</th>`
|
||||
).join('');
|
||||
const tbody = bodyRows.map((r: string[]) =>
|
||||
'<tr>' + r.map((c: string, i: number) =>
|
||||
`<td style="text-align:${alignCells[i] || 'left'}">${c}</td>`
|
||||
).join('') + '</tr>'
|
||||
).join('');
|
||||
const html = `<table class="md-table"><thead><tr>${thead}</tr></thead><tbody>${tbody}</tbody></table>`;
|
||||
const idx = tableBlocks.length;
|
||||
tableBlocks.push(html);
|
||||
return '\x00TABLE' + idx + '\x00';
|
||||
}
|
||||
);
|
||||
|
||||
// 8. Lists
|
||||
text = text.replace(/^\s*[-*] (.+)$/gm, '<li class="md-li">$1</li>');
|
||||
text = text.replace(/^\s*\d+\. (.+)$/gm, '<li class="md-li">$1</li>');
|
||||
// Wrap consecutive <li> in <ul>
|
||||
text = text.replace(/((?:<li class="md-li">[\s\S]*?<\/li>\n?)+)/g, '<ul class="md-ul">$1</ul>');
|
||||
|
||||
// 9. Convert double newlines to paragraph breaks, single newlines to spaces
|
||||
text = text.replace(/\n\n/g, '</p><p class="md-p">');
|
||||
text = text.replace(/\n/g, ' ');
|
||||
|
||||
// 10. Restore code blocks and inline codes
|
||||
text = text.replace(/\x00CODEBLOCK(\d+)\x00/g, (_m: string, idx: string) => codeBlocks[parseInt(idx)] || '');
|
||||
text = text.replace(/\x00MERMAID(\d+)\x00/g, (_m: string, idx: string) => mermaidBlocks[parseInt(idx)] || '');
|
||||
text = text.replace(/\x00INLINE(\d+)\x00/g, (_m: string, idx: string) => inlineCodes[parseInt(idx)] || '');
|
||||
text = text.replace(/\x00TABLE(\d+)\x00/g, (_m: string, idx: string) => tableBlocks[parseInt(idx)] || '');
|
||||
text = text.replace(/\x00MATHBLOCK(\d+)\x00/g, (_m: string, idx: string) => mathBlocks[parseInt(idx)] || '');
|
||||
|
||||
// 10.5 Apply syntax highlighting to code blocks + add copy button
|
||||
text = text.replace(
|
||||
/<pre class="md-code-block"><code class="md-code">([\s\S]*?)<\/code><\/pre>/g,
|
||||
(_m: string, code: string) => {
|
||||
const decoded = code.replace(/</g, '<').replace(/>/g, '>').replace(/&/g, '&');
|
||||
let highlighted: string;
|
||||
try { highlighted = hljs.highlightAuto(decoded).value; } catch { highlighted = code; }
|
||||
return `<div class="md-code-wrapper">
|
||||
<button class="md-code-copy" onclick="navigator.clipboard.writeText(this.parentElement.querySelector('code').textContent);this.textContent='已复制';setTimeout(()=>this.textContent='复制',2000)">复制</button>
|
||||
<pre class="md-code-block"><code class="md-code hljs">${highlighted}</code></pre>
|
||||
</div>`;
|
||||
}
|
||||
);
|
||||
|
||||
// 11. Wrap in paragraph and clean up
|
||||
text = '<p class="md-p">' + text + '</p>';
|
||||
text = text.replace(/<p class="md-p"><\/p>/g, '');
|
||||
text = text.replace(/<p class="md-p">(<h[234][\s\S]*?<\/h[234]>)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<pre[\s\S]*?<\/pre>)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<ul[\s\S]*?<\/ul>)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<hr[\s\S]*?)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<blockquote[\s\S]*?<\/blockquote>)<\/p>/g, '$1');
|
||||
text = text.replace(/<p class="md-p">(<table[\s\S]*?<\/table>)<\/p>/g, '$1');
|
||||
|
||||
return { html: text, media: mediaBlocks };
|
||||
}
|
||||
@@ -70,7 +70,7 @@ CREATE TABLE IF NOT EXISTS `skill_trajectory_links` (
|
||||
`skill_name` VARCHAR(200) NOT NULL,
|
||||
`user_id` VARCHAR(36) NOT NULL,
|
||||
`trajectory_id` VARCHAR(36),
|
||||
`atom_id` VARCHAR(36),
|
||||
`atom_id` VARCHAR(128),
|
||||
`weightscore` INT DEFAULT 0,
|
||||
`created_at` DATETIME DEFAULT CURRENT_TIMESTAMP,
|
||||
INDEX `idx_stl_user_skill` (`user_id`, `skill_name`),
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
-- 021: 加宽 skill_trajectory_links.atom_id 列
|
||||
-- 背景：atom_id 实际值形如 "{trajectory_id}_atom_{i}"（UUID 36 + "_atom_" + 序号 ≈ 45 字符），
|
||||
-- 原 VARCHAR(36) 过短导致写入时 DataError(1406) Data too long，并使会话进入 rolled-back 状态，
|
||||
-- 级联触发 PendingRollbackError 与日志 trace_id KeyError 刷屏。
|
||||
-- 本迁移幂等：重复执行 MODIFY 到相同类型为无害 no-op。
|
||||
|
||||
ALTER TABLE `skill_trajectory_links` MODIFY COLUMN `atom_id` VARCHAR(128) NULL;
|
||||
@@ -56,7 +56,7 @@ CREATE TABLE IF NOT EXISTS `distribution_licenses` (
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
|
||||
|
||||
-- Insert seed data: sample distributions
|
||||
INSERT INTO `distributions` (`id`, `name`, `description`, `brand_name`, `brand_color`, `provider`, `model`, `features`, `status`) VALUES
|
||||
INSERT IGNORE INTO `distributions` (`id`, `name`, `description`, `brand_name`, `brand_color`, `provider`, `model`, `features`, `status`) VALUES
|
||||
('distro-starter', 'Starter Edition', '基础版发行包，适合个人开发者和小团队', 'AI Starter', '#6366f1', 'siliconflow', 'deepseek-ai/DeepSeek-V4-Flash', '["chat", "code_exec"]', 'active'),
|
||||
('distro-enterprise', 'Enterprise Edition', '企业版发行包，包含完整 MCP 生态 + Agent 协作', 'AI Enterprise', '#f59e0b', 'siliconflow', 'deepseek-ai/DeepSeek-V4-Flash', '["chat", "code_exec", "knowledge_search", "agent_collab"]', 'active'),
|
||||
('distro-devops', 'DevOps Edition', 'DevOps 专用发行包，CI/CD + 代码审查 + 部署', 'AI DevOps', '#10b981', 'siliconflow', 'deepseek-ai/DeepSeek-V4-Flash', '["chat", "code_exec", "automation", "webhook"]', 'active');
|
||||
@@ -84,6 +84,11 @@ CREATE TABLE IF NOT EXISTS usage_reports (
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
|
||||
|
||||
-- 5. Add privacy_mode to distributions table
|
||||
ALTER TABLE distributions
|
||||
ADD COLUMN IF NOT EXISTS privacy_mode ENUM('local', 'cloud', 'hybrid') NOT NULL DEFAULT 'cloud'
|
||||
COMMENT 'Deployment mode for distribution' AFTER status;
|
||||
-- MariaDB 11.8 不支持 ADD COLUMN IF NOT EXISTS 语法，改用 information_schema 预检 + 动态 PREPARE 实现幂等
|
||||
SET @exist_pm := (SELECT COUNT(*) FROM information_schema.COLUMNS WHERE TABLE_SCHEMA = 'aiflow' AND TABLE_NAME = 'distributions' AND COLUMN_NAME = 'privacy_mode');
|
||||
SET @sql_pm := IF(@exist_pm = 0,
|
||||
"ALTER TABLE distributions ADD COLUMN privacy_mode ENUM('local', 'cloud', 'hybrid') NOT NULL DEFAULT 'cloud' COMMENT 'Deployment mode for distribution' AFTER status",
|
||||
'SELECT 1');
|
||||
PREPARE stmt_pm FROM @sql_pm;
|
||||
EXECUTE stmt_pm;
|
||||
DEALLOCATE PREPARE stmt_pm;
|
||||
Reference in new issue
Block a user