LaTeX 公式渲染问题修复报告

LaTeX 公式渲染问题修复报告

🐛 问题描述

在全站重新生成 HTML 后,发现 LaTeX 公式无法渲染,仅显示为纯文本(如 $$...$$)。

🔍 问题根源

经过排查,发现问题出在 <code>article_template.php</code> 文件的 PHP heredoc 语法上。

具体原因

  • PHP heredoc 语法(<<<HTML ... HTML;)在处理包含 中文字符 的 JavaScript 字符串时出现问题
  • 导致 HTML 文件在生成过程中被截断,底部脚本部分缺失
  • 结果:KaTeX 和 Prism.js 的 <script> 标签没有完全插入到生成的 HTML 中

技术细节

// 问题代码 - heredoc 在包含中文时容易出错
button.textContent = '复制';  // 这行会导致文件截断

✅ 解决方案

方案:使用字符串拼接代替 heredoc

创建新模板文件 <code>articletemplatev2.php</code>,使用字符串拼接方式构建 HTML:

function generateArticleHtml($title, $content, $currentDir) {
    $rootPath = getRootPath($currentDir);
    
    // 使用字符串拼接而不是 heredoc
    $html = '<!DOCTYPE html>' . "\n";
    $html .= '<html lang="zh-CN">' . "\n";
    // ... 继续拼接
    $html .= '</html>';
    
    return $html;
}

优势

  • ✅ 完全避免中文字符导致的截断问题
  • ✅ 更精确的 HTML 结构控制
  • ✅ 更高的兼容性和稳定性

🛠️ 实施的修复步骤

  1. 创建新模板 (blog/articletemplate_v2.php)

- 使用字符串拼接方式重构整个 HTML 模板 - 确保所有脚本引用正确包含

  1. 更新配置文件 (_blog/config.php)

``php // 加载新模板 if (fileexists(<strong>DIR</strong> . DIRECTORYSEPARATOR . 'articletemplatev2.php')) { requireonce <strong>DIR</strong> . DIRECTORYSEPARATOR . 'articletemplatev2.php'; } ``

  1. 重新生成 HTML

``bash php -r "requireonce &apos;blog/config.php'; checkAndUpdateHtml('agi/mHC研读.md', 'agi/mHC研读.html');" ``

  1. 验证修复

- 检查文件完整性(以 `` 结尾) - 确认 KaTeX 和 Prism.js 脚本存在 - 确认 LaTeX 公式存在于 HTML - 浏览器实际测试渲染效果

📊 验证结果

文件完整性检查

✅ 文件以 </html> 结尾
✅ 文件大小:约 20KB+(完整)
✅ 总行数:300+ 行(完整)

脚本引用检查

✅ prism-core.min.js (Prism.js 核心)
✅ prism-autoloader.min.js (自动加载语法)
✅ katex.min.js (KaTeX 核心)
✅ auto-render.min.js (自动渲染公式)
✅ renderMathInElement() 调用

内容检查

✅ Inline formula: $E = mc^2$ found
✅ Display formula: $$x = \frac...$$ found
✅ Python code blocks found
✅ Copy buttons found

🎉 修复效果

修复前

  • ❌ HTML 文件被截断,大小约 18KB
  • ❌ 底部缺少 KaTeX 和 Prism.js 脚本
  • ❌ LaTeX 公式显示为纯文本 $$...$$
  • ❌ 代码高亮部分失效

修复后

  • ✅ HTML 文件完整,大小约 20KB+
  • ✅ 包含完整的 KaTeX 和 Prism.js 脚本
  • ✅ LaTeX 公式被 KaTeX 正确渲染
  • ✅ 代码高亮正常工作
  • ✅ 复制按钮正常工作

🔧 技术改进

最佳实践

  1. 避免在 PHP heredoc 中使用中文

```php // ❌ 避免 $str = <<

// ✅ 推荐 $str = ''; ```

  1. 字符串拼接更可靠

``php // ✅ 推荐(避免编码问题) $html = '

' . $content . ''; ``

  1. 模板版本管理

- 保留旧模板作为备份 - 使用版本号管理模板(v1, v2) - 便于回滚和调试

📋 建议的后续行动

  1. 已修复: mHC 研读文章已重新生成
  2. 🔄 建议: 重新生成所有 HTML 以确保一致性

``bash php regenerate_all.php # 如果存在 ``

  1. 📝 文档: 更新开发文档,记录此问题和解决方案
  2. 🔍 监控: 定期检查生成的 HTML 文件完整性

💡 总结

根本原因: PHP heredoc 与中文字符的兼容性问题 解决方案: 改用字符串拼接方式构建 HTML 验证: 所有检查通过,LaTeX 和代码高亮正常工作


修复完成时间: 2026-01-06 15:30 影响文件: blog/articletemplate.phpblog/articletemplate_v2.php 状态: ✅ 已解决

← 返回目录