Mathjax回退：如果HTML-CSS webfont失败，请在使用图像字体之前尝试SVG

Question

（我使用的是STIX字体，但这个问题也与TeX字体有关。）

我的问题是：如何在我的网页上配置mathjax，以便查看网页的用户体验以下1-

1. 超文本标记语言-CSS（webFont"STIX-Web"，本地"STIX"）
2. SVG（"STIX-Web"）
3. 所有其他回退选项（本地通用，映像等）

换句话说，我们的想法是将HTML-CSS作为首选，但如果HTML-CSS失败，那么就回到SVG，而不是本地通用字体或图像字体。

后备策略需要适用于（1）中的各种故障。例如，当无法使用HTML-CSS中的本地字体时（或者因为用户没有在本地安装字体，或者因为我通过availableFonts:[]和preferredFont:null）在网页中显式禁用本地字体），它都应该起作用，此外，当无法使用HTML-CSS网页字体时（用户已禁用网页字体，浏览器同源策略将被强制执行，等等）。

它还应该独立于客户端用户在“数学”上下文菜单中最后选择的渲染器。目前，如果用户在客户端浏览器上最后一次通过“数学”菜单选择HTML-CSS作为渲染器，那么每当（1）失败时，mathjax就会返回（3），跳过（2）。如果用户上次选择SVG作为渲染器，则HTML-CSS不再是首选，即（1）被完全跳过。

Answer 1

下面的配置似乎实现了所需的回退链（在我有限的测试中）。

<script type="text/javascript"
  src="../MathJax-2.7.1/MathJax.js?config=TeX-AMS-MML_SVG">
</script>

<script type="text/x-mathjax-config">
//
// - Mathjax config to implement the following fallback chain:
//
//     1. HTML-CSS webFont ("STIX-Web")
//     2. SVG ("STIX-Web")
//     3. Other fallback fonts (local generic, image, etc)
//
// - Change availableFonts to ["STIX"] and preferredFont to "STIX"
//   to allow local STIX fonts. Implements the fallback chain below:
//
//     1. HTML-CSS local ("STIX")
//     2. HTML-CSS webFont ("STIX-Web")
//     3. SVG ("STIX-Web")
//     4. Other fallback fonts (local generic, image, etc)
//

//
// Use STIX font consistently across HTML-CSS and SVG
//
MathJax.Hub.Config({
    jax: ["input/TeX", "input/MathML",
        "output/HTML-CSS", "output/SVG", "output/PreviewHTML"
    ],
    "HTML-CSS": {
        imageFont: null,
        webFont: "STIX-Web",
        availableFonts: [],    // Or: ["STIX"], to allow local
        preferredFont: null    // Or: "STIX", to allow local
    },
    "SVG": {
        font: "STIX-Web"
    }
});

MathJax.Hub.Register.StartupHook("End Jax", function() {

    // 1. Set HTML-CSS as the initially preferred output processor.
    //    (Temporarily overrides the renderer value set by MathMenu
    //    without affecting the user's chosen renderer elsewhere.)
    var jax = "HTML-CSS";
    MathJax.Hub.setRenderer(jax);

    // 2. Install callback which switches renderer to SVG if HTML-CSS fails.
    var nopast = true;
    MathJax.Hub.Startup.signal.Interest(QueSVGfallback, nopast);

});

</script>

<script>
//
// This callback (when installed) scans through messages to check
// (as in FontWarnings.js) if HTML-CSS font loading has failed.
// If so, it queues a request to switch to SVG rendering.
//
var QueSVGfallback = (function() {    // Anonymous "closure" to keep quecount
    var quecount = 0;
    return function(m) {              // The real callback function
        if (quecount > 0) return;     // Prevent multiple queueing
        m = m + "";
        if (m.match(/HTML-CSS Jax - /)) {
            if (m.match(/- using image fonts/) ||
                    m.match(/- no valid font/) ||
                    m.match(/- disable web fonts/)) {
                MathJax.Hub.Queue(
                    ["setRenderer", MathJax.Hub, "SVG", "jax/mml"],
                    ["Rerender", MathJax.Hub]
                );
                quecount++;
            }
        }
    }
})();
</script>