使用 JavaScript 检测 WOFF 支持？

Posted 2023-04-14

【中文标题】使用 JavaScript 检测 WOFF 支持？

【英文标题】：Detect WOFF support with JavaScript?

【发布时间】：2016-02-11 20:31:31

【问题描述】：

我有一种情况，我正在使用 Data-URI 加载字体，并且只想使用一种文件类型，WOFF。不使用备用字体也很重要，因此我正在寻找一种方法来检测 javascript 是否支持 WOFF。是否可以检测 WOFF（不是 WOFF2）支持？

这个问题以前曾被问过 (Detecting with Javascript whether a Browser supports Web Open Font Format (Woff) or not)，但给出和接受的答案与检测 WOFF 支持无关。

【问题讨论】：

试试这个帖子：***.com/questions/7570211/…

@sev 有趣的是，这个问题的最佳答案似乎并没有真正回答这个问题......

@sev 我已经看到了，但看起来他们想要的答案实际上是字体支持。

@James 是的，我认为发布的新答案应该适合你

【参考方案1】：

看起来不支持 WOFF 的浏览器只有 IE 8、Opera Mini 和 4.3 之前的 android：http://caniuse.com/#feat=woff

然后您可以通过查看addEventListener 是否存在来检查IE8，并通过查看operamini 是否存在来检查Opera Mini：

// from http://***.com/a/19572784/4338477
function getAndroidVersion(ua) 
    ua = (ua || navigator.userAgent).toLowerCase(); 
    var match = ua.match(/android\s([0-9\.]*)/);
    return match ? match[1] : false;


if ((document.all && !document.addEventListener) || 
        (!!window['operamini']) || 
        (parseFloat(getAndroidVersion() < 4.4)) 
    // IE 8, Opera Mini, Android 4.3 or lower: No WOFF support
 else 
    // Supports WOFF

【讨论】：

Android 的早期版本怎么样？

它应该检查小于 4.4 的任何内容。如果这不起作用，***.com/a/19572784/4338477 中的其他答案会检查不同的检测边缘情况