在phpBB3中渲染latex公式的方法
发表于 ： 2024年4月18日 15:24
三年前，我用的是mathtex.cgi渲染LaTex公式，但这办法失效了，直接报nginx 502错误，后台看是那个方法在html5的标准下属于怪异模式（quirks mode），nginx服务器不和你玩儿了。想想也正常，十几年前的老古董了，跟不上时代是必然的。何况cgi这技术路径，看着就不安全。
另辟蹊径吧，可最早探讨phpBB论坛上渲染LaTex公式的帖子是2007年的事。我也不知道是phpBB的用户很陋，从来不贴公式，抑或是水平很高，无师自通，不用求教和讨论。
我搜索半天，挺痛苦的，就是高人们总是不给你完整的实现过程，都是拣最精要的地方用只言片语秀一下就打住，可能非如此无以显其高吧。总的来说，IT领域对我这样的非专业人士来说很不友好，民科不好混啊。
最后我找到了“MathJax的基本使用 - 启明星工作室 - 博客园”这篇文章，总算把问题攒起来了，终于取得了突破，基本搞定了这个问题。现录出如下：
在overall_header.html的head段里加上一下来自katex官网文档的代码：
其中，katex.min.js,auto-render.min.js和katex.min.css可以用wget从上面各自的链接中下载后，放在网站根目录中，用.\auto-render.min.js这样的方式引用。
没必要用BBcode标签了，直接单\$分割符渲染行内公式，左对齐；双\$分隔符渲染行间公式，另起一行，居中。
另外，还可以用MathJax实现公式渲染，但渲染速度要慢一些，而且js和css文件没法下载到本地引用。其overall_header.html的加入代码如下：
也是不用标签了，同上用单或双\$符号框住渲染即可。效果如下：
另辟蹊径吧，可最早探讨phpBB论坛上渲染LaTex公式的帖子是2007年的事。我也不知道是phpBB的用户很陋，从来不贴公式，抑或是水平很高，无师自通，不用求教和讨论。
我搜索半天，挺痛苦的，就是高人们总是不给你完整的实现过程，都是拣最精要的地方用只言片语秀一下就打住，可能非如此无以显其高吧。总的来说，IT领域对我这样的非专业人士来说很不友好，民科不好混啊。
最后我找到了“MathJax的基本使用 - 启明星工作室 - 博客园”这篇文章，总算把问题攒起来了，终于取得了突破，基本搞定了这个问题。现录出如下：
在overall_header.html的head段里加上一下来自katex官网文档的代码：
代码： 全选
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-wcIxkf4k558AjM3Yz3BBFQUbk/zgIYC2R0QpeeYb+TwlBVMrlgLqwRjRtGZiK7ww" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-hIoBPJpTUs74ddyc4bFZSM1TVlQDA60VBbJS0oA934VSz82sBx1X7kSx2ATBDIyd" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" integrity="sha384-43gviWU0YVjaDtb/GhzOouOXtZMP/7XUzwPTstBeZFe/+rCMvRwr4yROQP43s0Xk" crossorigin="anonymous"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
// customised options
// • auto-render specific keys, e.g.:
delimiters: [
{left: '$$', right: '$$', display: true},
{left: '$', right: '$', display: false},
{left: '\\(', right: '\\)', display: false},
{left: '\\[', right: '\\]', display: true}
],
// • rendering keys, e.g.:
throwOnError : false
});
});
</script>没必要用BBcode标签了，直接单\$分割符渲染行内公式，左对齐；双\$分隔符渲染行间公式，另起一行，居中。
另外，还可以用MathJax实现公式渲染，但渲染速度要慢一些，而且js和css文件没法下载到本地引用。其overall_header.html的加入代码如下：
代码： 全选
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { fonts: ["TeX"] }
});
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-AMS_HTML">
</script>- 屏幕截图 2024-04-20 062235.png (8.89 KiB) 查看 2457 次
