feat(web): 在 renderMarkdown 中集成 SVG 渲染(DOMPurify 默认已支持 SVG)

- 导入 renderSvgBlocks() 并在 markdown-it 渲染前调用
- cacheKey 基于 SVG 转换后的内容,保证缓存一致性
- DOMPurify 配置保持不变(默认白名单已支持 SVG)
This commit is contained in:
supreme0597 2026-05-15 05:15:29 +08:00
parent 6938dfe18d
commit f764415e4d

View File

@ -6,6 +6,7 @@ import { createHighlighter } from 'shiki'
import yaml from 'js-yaml'
import { escapeHtml } from '@/utils/html'
import { normalizeCodeLanguage } from '@/utils/file_preview'
import { renderSvgBlocks } from './svgRenderer'
const markdownKatexPlugin = markdownItKatex.default || markdownItKatex
const FRONTMATTER_MARKER = '---'
@ -198,19 +199,20 @@ const setCachedHtml = (cacheKey, html) => {
export const renderMarkdown = async (content, { theme = 'github-light' } = {}) => {
try {
const normalizedContent = normalizeHtmlTagQuotes(content)
const svgContent = renderSvgBlocks(normalizedContent)
const themeName = normalizeTheme(theme)
const needsHighlight = hasCodeFence(normalizedContent)
const cacheKey = `${needsHighlight ? themeName : 'plain'}\u0000${normalizedContent}`
const needsHighlight = hasCodeFence(svgContent)
const cacheKey = `${needsHighlight ? themeName : 'plain'}\u0000${svgContent}`
const cachedHtml = getCachedHtml(cacheKey)
if (cachedHtml !== undefined) return cachedHtml
if (needsHighlight) {
const highlighter = await getHighlighter()
await ensureLanguages(highlighter, collectCodeFenceLanguages(normalizedContent))
await ensureLanguages(highlighter, collectCodeFenceLanguages(svgContent))
}
const md = await getRenderer(themeName, needsHighlight)
const html = DOMPurify.sanitize(md.render(normalizedContent), {
const html = DOMPurify.sanitize(md.render(svgContent), {
ADD_TAGS: ['input'],
ADD_ATTR: [
'class',