带有本地文件的Firefox @ font-face-可下载字体：下载失败

小编典典

带有本地文件的Firefox @ font-face-可下载字体：下载失败

css

我在使用通过相对URL访问的字体时遇到问题。

@font-face {
    font-family: 'ElegantIcons';
    src:url('../src_main/fonts/ElegantIcons.eot');
    src:url('../src_main/fonts/ElegantIcons.ttf') format('truetype'),
        url('../src_main/fonts/ElegantIcons.svg#ElegantIcons') format('svg'),
        url('../src_main/fonts/ElegantIcons.woff') format('woff'),
        url('../src_main/fonts/ElegantIcons.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

当我访问网页时，字体不起作用，在控制台中，我得到以下信息：

downloadable font: download failed (font-family: "ElegantIcons" style:normal weight:normal stretch:normal src index:1): status=2147500037
source: file:///...snipped.../src_main/fonts/ElegantIcons.woff @ file:///...snipped.../src_poke/fonts-style.css

通过将URL复制/粘贴到浏览器地址栏中来访问文件，这表明它是正确的URL，因为我可以下载字体。

阅读 606

2020-05-16

共1个答案

小编典典

乔纳森·邱（Jonathan Kew）对有关MozillaBugzilla条目的回应的提示：

我相信这是按设计工作的。AIUI，这里的问题是，对于从file：//
URI加载的页面，只有文件系统相同目录中（或以下）的文件才被视为“相同来源”，因此将字体放在不同的子树中（../font/）表示它将被安全策略限制所阻止。

您可以通过在about：config中将security.fileuri.strict_origin_policy设置为false来放松这一点，但是由于这使页面可以访问整个本地文件系统，因此请谨慎使用。

概括来说，“修复”无需重新排列文件：

打开about：config
设为security.fileuri.strict_origin_policy假
当心安全隐患

但是，最好的方法是确保可访问任何资源，而无需先备份文件系统。

注意： 来源政策是根据html而不是css文件计算的！因此，除CSS文件外的字体文件可能无法工作，这非常令人困惑。
（至少我认为这是Firefox的情况！）

跟进：

埃德曼评论：

这是另一回事：相对路径是相对于CSS文件的

克莱里斯回应：

您可能会认为，但是Firefox中的实际代码似乎并不相同。

2020-05-16