用KaTeX在node.js模板中渲染math
我想在node.js使用latex模式在页面中渲染math。 我看了MathJaX和KaTeX 。
我用我的页面
router.get('/math', function (req, res) { res.render('math'); });
所以我怎样才能确保在这个网页上的math是math呈现？
我可以用
const katex = require('katex'); const math = katex.renderToString("c = \\pm\\sqrt{a^2 + b^2}", { displayMode: true });
然后在模板中设置variables
router.get('/math', function (req, res) { res.render('math', { math: math }); });
但我宁愿要直接在模板中写所有的math，而不是专门在JavaScript代码中设置每个variables。
编辑
我正在从模板中获取html
router.get('/math', function (req, res) { res.render('math', function (err, html) { html = html.replace(/\$\$(.*?)\$\$/g, function (outer, inner) { return katex.renderToString(inner, { displayMode: true }); }); res.send(html); }); });
这是一个很好的做法，或者我可以省略使用res.send()之前调用res.render() res.send() ？
当我使用
html = html.replace(/\$\$(.*?)\$\$/g, function (outer, inner) { return katex.renderToString(inner, { displayMode: true }); }).replace(/\$(.*?)\$/g, function (outer, inner) { return katex.renderToString(inner); });
服务器失败，我得到的错误ParseError: KaTeX parse error: Expected 'EOF', got '$' at position 1: $_
KaTeX核心不关心文本input的来源。 识别TeX源代码片段不是其目标的一部分。 有一个名为auto-render的扩展名，作为KaTeX代码库的一部分进行维护。 它将识别页面内的TeXinput，并用KaTeX呈现的HTMLreplace它。 但它在DOM树上运行客户端，而不是HTML标记文本的服务器端。
所以我build议你在这里推出自己的代码。 我想你应该不需要任何DOMparsing。 相反，我会试着想出一些合适的正则expression式来描述math模块，然后用它们的renderToString类似物replace它们。 就像是
html = html.replace(/\$\$(.*?)\$\$/g, function(outer, inner) { return katex.renderToString(inner, { displayMode: true }); }).replace(/\\\[(.*?)\\\]/g, function(outer, innner) { return katex.renderToString(inner, { displayMode: true }); }).replace(/\\\((.*?)\\\)/g, function(outer, innner) { return katex.renderToString(inner, { displayMode: false }); });
根据您的用例，您可能希望将此replace应用到您的input模板，您提供给模板的参数，或者从呈现模板获得的结果。 在所有这三种情况下，您都应该试着在某些时候将您的HTML文本的相关部分作为单个string来使用。 在某些情况下可能涉及缓冲基于stream的模板输出。 既然你没有说出你用于模板和应用服务器的框架，我不能提供更多的细节。
请注意，上述给TeX比HTML更高的优先级：input如$$a<p>b$$被解释为TeXinputa < p > b 。 这与客户端渲染（如自动渲染器）相反，上面的代码被视为两个段落，它们都不包含一个完整的TeXinput片段，以及在哪里实现a < p > b渲染必须编码< as < 。 如果你控制所有的input，给予TeX优先权可能是你想要的。 但是，如果您接受用户提供的input，则此行为可能会导致一些内容消毒过程或Wiki标记格式化代码的意外。 所以，如果你打算按照这些方法做任何事情，确保你知道你想要什么样的行为，并让你的客户意识到这一点。
如果你想要更高的兼容性，你可以尝试支持额外的顶级环境。 例如，你可以包括
html = html.replace(/\\begin\{align\*\}(.*?)\\end\{align\*\}/g, function(outer, inner) { return katex.renderToString("\\begin{aligned}" + inner + "\\end{aligned}", { displayMode: true }); })
使用aligned环境已经实现，而align*环境还没有实现的事实。
为了回应你的编辑：
res.render与callback和res.send在callback中的组合看起来不错。 你可以避免调用res.render如果你调用模板渲染自己，而是由你来决定是否可取。
错误信息的原因很难决定，而不知道input。 看起来好像你可能有一些input以double $$开头，但是只以一个$结尾，所以第一个正则expression式匹配失败，第二个匹配的string中包含额外的$ 。