问答博客标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
php
java
vue.js
git
html5
python
node.js
android
mysql
react.js
linux
ios
css
golang
spring
docker
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

为何无法在本地使用MathJax.js?

头像
luofeiyu
    1.6k29323678

    为了使网页可以显示latex,我引用了cdn中的MathJax.js:

       <!DOCTYPE html>
   <html>
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
   <script type="text/javascript" async
     src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML">
   </script>
   <script type="text/x-mathjax-config">
   MathJax.Hub.Config({
     tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]},
   });
   </script>
   </head>
   <body>
   First of all, we can "relax" the $\forall$-Introduction rule : $A \to B \vdash A \to \forall x B$, provided that $x$ is not *free* in $A$.
   </body>
   </html>

    显示效果很好。
    image.png

    现在，我下载https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?到本地后，MathJax.js可以在127.0.0.1/wp/MathJax.js打开（本机上有个apache服务器）。我将html页面修改

       <!DOCTYPE html>
   <html>
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
   <script type="text/javascript" async
     src="127.0.0.1/wp/MathJax.js?config=TeX-MML-AM_CHTML">
   </script>
   <script type="text/x-mathjax-config">
   MathJax.Hub.Config({
     tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]},
   });
   </script>
   </head>
   <body>
   First of all, we can "relax" the $\forall$-Introduction rule : $A \to B \vdash A \to \forall x B$, provided that $x$ is not *free* in $A$.
   </body>
   </html>

    用浏览器查看127.0.0.1/wp/test.html，出现这样的错误

    image.png

    请问，如何解决这个问题？

    javascript
    阅读 952
    avatarAI BotBETA

    你遇到的问题很可能是由于在本地引用 MathJax.js 时，URL 格式不正确或者相对路径解析问题导致的。在你的 HTML 文件中，你尝试使用 src="127.0.0.1/wp/MathJax.js?config=TeX-MML-AM_CHTML"，但这种方式可能不会如你所期望地工作，因为 URL 缺少了协议部分（通常是 http:// 或 https://），并且参数 ?config=TeX-MML-AM_CHTML 直接附加在文件名之后，这可能会导致浏览器无法正确解析该 URL。

    解决方案

    1. 确保 URL 格式正确：
      你应该在 URL 中包含协议部分，并且确保文件路径正确。如果你的 MathJax.js 文件位于本地服务器（如 Apache）的 /wp/ 目录下，你应该使用类似 http://127.0.0.1/wp/MathJax.js 的 URL，并且单独配置 MathJax。
    2. 分开配置 MathJax：
      由于直接在 URL 中添加查询参数（如 ?config=TeX-MML-AM_CHTML）可能不被支持或解析不正确，你应该在 <script> 标签中仅指定 MathJax 的基本路径，然后在 <script type="text/x-mathjax-config"> 标签中配置 MathJax。

    修改后的 HTML

    <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <!-- 指定 MathJax 的基本 URL -->
  <script type="text/javascript" async src="http://127.0.0.1/wp/MathJax.js"></script>
  <script type="text/x-mathjax-config">
    MathJax.Hub.Config({
      // 配置 MathJax
      tex2jax: {
        inlineMath: [['$','$'], ['\\(','\\)']],
        processEscapes: true  // 可选，允许转义字符（如 \$）被识别为 LaTeX
      },
      // 指定加载的配置文件
      config: ["TeX-MML-AM_CHTML.js"],
      // 或者使用下面的方式直接加载配置（取决于 MathJax 版本）
      // jax: ["input/TeX", "output/CommonHTML"]
    });
  </script>
</head>
<body>
  First of all, we can "relax" the $\forall$-Introduction rule : $A \to B \vdash A \to \forall x B$, provided that $x$ is not *free* in $A$.
</body>
</html>

    注意：

    • 我添加了 processEscapes: true，这是一个可选的配置，它允许你在文本中使用转义字符（如 \$）来避免被解释为 LaTeX。
    • 确保你的 Apache 服务器配置正确，并且 MathJax.js 文件确实位于 /wp/ 目录下。
    • 如果你使用的是较新版本的 MathJax（如 3.x），配置方式会有所不同，你可能需要查阅 MathJax 的官方文档来获取正确的配置方法。
    1 个回答
    得票最新
    头像
    42
      3.8k1623

      这是因为 CDN 中的 MathJax 引用了其他文件而你没有下载到本地，例如：

      // MathJax.js
import xxx from './extension/MathZoom.js'
// 其他代码

      CDN 中有 extension/MathZoom.js 而你仅下载了 MathJax.js 导致出现 404 错误。

      如果你想解决这个问题，需要将 CDN 中的全部文件下载下来，然而这并不是一个好主意。如果你想在本地部署 MathJax，可以参考 MathJax 的官方文档：托管自己的 Mathjax 副本（英文）。

      查看全部 1 个回答
      推荐问题
      宣传栏