Ошибка downloadable font - Не ошибается лишь тот, кто ничего не делает!

Создал иконочный шрифт, подключил к странице. Firefox выдает такую ошибку в консоли:

downloadable font: download failed (font-family: "untitled-font-1" style:normal weight:normal stretch:normal src index:1): status=2152857618 source: file:///C:/Users/Lenovo/Desktop/csgosite/css/fonts/untitled-font-1.woff
downloadable font: download failed (font-family: "untitled-font-1" style:normal weight:normal stretch:normal src index:2): status=2152857618 source: file:///C:/Users/Lenovo/Desktop/csgosite/css/fonts/untitled-font-1.ttf

Стили CSS:

@charset "UTF-8";

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

}

[data-icon]:before {
  font-family: "untitled-font-1" !important;
  content: attr(data-icon);
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "untitled-font-1" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-classic-icon:before {
  content: "61";
}
.icon-copy-icon:before {
  content: "62";
}
.icon-craft-icon:before {
  content: "63";
}
.icon-double-icon:before {
  content: "64";
}
.icon-crash-icon:before {
  content: "65";
}
.icon-case-icon:before {
  content: "66";
}
.icon-vk-icon:before {
  content: "67";
}
.icon-youtube-icon:before {
  content: "68";
}

Источник

I am having an issue with using a font accessed via a relative 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;
}

When I access the web page the font doesn’t work and in the console I get this:

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

Accessing the file by copying/pasting the URL into the browser address bar shows that it is the correct URL as I can download the font.

asked Nov 6, 2013 at 16:31

Charles GoodwinCharles Goodwin

6,3723 gold badges34 silver badges62 bronze badges

A hat tip to Jonathan Kew’s response on a relevant mozilla bugzilla entry:

I believe this is working as designed. AIUI, the issue here is that
for a page loaded from a file:// URI, only files in (or below) the
same directory of the filesystem are considered to be «same origin»,
and so putting the font in a different subtree (../font/) means it
will be blocked by security policy restrictions.

You can relax this by setting security.fileuri.strict_origin_policy to
false in about:config, but as this gives the page access to your
entire local filesystem, it’s something to be used with caution.

To summarise, the «fix» without re-arranging your files:

Open about:config
Set security.fileuri.strict_origin_policy to false
Beware of the security implications

The best way is, however, to make sure any resources are accessible without going back up the file system first.

Note: the origin policy is calculated based on the html, NOT the css file! So a font file right besides an css file might not work, which is very confusing. (At least this is what I thought was the case with Firefox!)

Follow ups:

eradman comments:

It’s the other way around: relative paths are relative to the CSS file.

chrylis responds:

You’d think that, but the actual code in Firefox doesn’t seem to agree.

answered Nov 6, 2013 at 16:31

Charles GoodwinCharles Goodwin

6,3723 gold badges34 silver badges62 bronze badges

@CharlesGoodwin @eradman Actually, both statements about the origin seem true except that they probably talk about two different things: same-origin check is based on the originating HTML file, while relative URLs for font faces are resolved relative to the CSS file containing the @font-face rule.

Moreover, originating HTML file is not the file that uses the font. I have the following local file structure.

<base-directory>/index.htm
<base-directory>/ARPLS/toc.htm
<base-directory>/dcommon/css/fonts.css
<base-directory>/dcommon/fonts/myfont.woff

fonts.css references myfont.css via url(../fonts/myfont.woff) and toc.htm reference fonts.css via <link … href=»../dcommon/css/fonts.css»>. index.htm has a hyperlink to toc.htm.
Now, I have bookmarked both index.htm and toc.htm. If I use the index.htm bookmark, the font is rendered correctly. If I use the toc.htm bookmark, the font fails to load. I guess this is because myfont.woff is in a sub-directory of the directory containing index.htm but not of the directory containing toc.htm.

Observed in Firefox 38.6.

answered Feb 8, 2016 at 1:10

Try adding this to your web.config

<system.webServer>
<staticContent>
  <clientCache cacheControlCustom="public" cacheControlMode="UseMaxAge" cacheControlMaxAge="365.00:00:00" />
  <remove fileExtension=".woff" />
  <remove fileExtension=".woff2" />
  <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
  <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
</staticContent>

answered Aug 9, 2017 at 6:31

Dan LeksellDan Leksell

5105 silver badges6 bronze badges

Usually this happens when the original source css has relative font face declaration like so ../fonts/some-font.woff, and you compile that source CSS into bundle.css which resides at some other path. So that way you lose the path to font.

answered Nov 22, 2018 at 19:04

I have been running into this issue since the latest update (about 1.5 weeks ago). This thread specifically, plus the comments in Bugzilla helped me to understand the problem as a security feature. The solution that I found (eventually) was to take my Firefox preferences off of «strict» security and set to standard/default. «Strict» even says it will break some sites, so I think that this goes to the above point that this issue is by-design.

answered Aug 6, 2019 at 15:21

Источник

I ran into an issue today when I tried to serve a typeface I downloaded from Google Fonts. When I added the files and @font-face rules to my CSS, I got the following error in the Firefox console:

downloadable font: rejected by sanitizer
    (font-family: "Inter" style:normal weight:400 stretch:100 src index:0)
    source: http://localhost:8080/fonts/Inter-Regular.ttf

The Chrome console had nothing, so I figured this was a Firefox issue. After some searching around, I learned that Firefox is checking that a font file is valid before loading it, which can protect you against some attacks.

Inter is a pretty popular typeface, so I ruled out corrupt or malicious font files. Further digging lead me to some solutions, but they seemed situation specific.

I was prepared to live with the error, when I gave it one last look. The source url (which I’ve wrapped here but was broken on two lines in the console) was incorrect. The path to the font files should have been assets/fonts/Inter-Regular.ttf. Fixing that path in @font-face’s src resolved the issue.

If you encounter a similar error, check to make sure that the path to your font file is correct. It would be helpful if the message was more descriptive: “downloadable font: rejected by sanitizer (file not found)“.

Happy font serving!

Источник

— anyone have a problem with this? I can’t get the CSS attribute font-face to work for downloadable fonts.
@font-face
{

     font-family: minecraft;
     src: url("../files/minecraft.ttf");

}

What is the sanitizer and how can I configure it to accept the downloaded font?

— anyone have a problem with this? I can’t get the CSS attribute font-face to work for downloadable fonts.
@font-face
{
font-family: minecraft;
src: url(«../files/minecraft.ttf»);
}

What is the sanitizer and how can I configure it to accept the downloaded font?

Chosen solution

You get this error if you run out of memory when loading the fontfile or if there is something wrong with the layout (contents) of the fontfile. This is a protection against bad or malicious font files. It is probably possible to disable the sanitizer by setting the pref gfx.downloadable_fonts.sanitize to false in about:config but then you are no longer protected. Use at your own risk. Do not blame Mozilla if you are infected with malware.

Read this answer in context
👍 5

All Replies (3)

Chosen Solution

Thanks cor-el; I will give this a try, so far it’s looking good — still gotta plug it in to my CSS to see if it will work.

This is for my college class so thanks for the speedy reply — I lost power over the last week with Ice storms and trees falling all around me — so please forgive the lateness of the reply.

Regards,

Saghalie

Halo Wawa, Boire du Cafe’

Modified January 21, 2012 at 1:11:13 PM PDT by Saghalie

Источник

Подключаю шрифт, везде работает, но в Mozilla Firefox ошибка:

downloadable font: no supported format found (font-family: «PT Sans»
style:normal weight:normal stretch:normal src index:3) source: (end of
source list)

/* cyrillic-ext */
@font-face {
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(../fonts/JX7MlXqjSJNjQvI4heMMGvY6323mHUZFJMgTvxaG2iE.woff2) format('woff2');
  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}

/* cyrillic */
@font-face {
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(../fonts/vtwNVMP8y9C17vLvIBNZI_Y6323mHUZFJMgTvxaG2iE.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

Что делать?

Источник

Вопрос:

Я использую свойство CSS3 font-face на своем локальном хосте и размещаю шрифт на своем веб-сайте для загрузки на локальную веб-страницу. Он корректно работает с IE и Chrome, но не в Firefox. Странно, когда я использую локальный URL-адрес, он также работает и с Firefox.

//Works with local URLs like http://localhost/repo/BMitra/BMitra.*
@font-face {
font-family: "BMitra";
src: url("http://fonts.gexek.com/repo/BMitra/BMitra.eot");
src: local("☺"),
url("http://fonts.gexek.com/repo/BMitra/BMitra.woff") format("woff"),
url("http://fonts.gexek.com/repo/BMitra/BMitra.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}

Я думал, что работа на локальном хосте может быть проблемой, но я обнаружил, что шрифты Google корректно работают на локальном хосте.

Вы можете увидеть эту скрипту в своем браузере Firefox и (Chrome OR IE), чтобы продемонстрировать, что я имею в виду.
http://jsfiddle.net/66QE3/1/

Что мне не хватает?

Лучший ответ:

В консоли ошибок Firefox говорится:

downloadable font: download failed (font-family: "BMitra" style:normal 
weight:normal stretch:normal src index:1): bad URI or cross-site access
not allowed
source: http://fonts.gexek.com/repo/BMitra/BMitra.woff

Чтобы использовать загружаемый шрифт из другого домена, сервер, на котором размещен шрифт, должен иметь настройки межсайтового доступа, что позволяет увидеть Контроль доступа HTTP (CORS).

Ответ №1

Источник

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account

Closed

africanw opened this issue

Dec 4, 2015

· 6 comments

Comments

Hi,

Been using the fonts for a while but yesterday I upgraded from 4.2 to 4.5 and noticed in firefoxs console an error appears which did not before. If I put 4.2 back the error does not show in firefox.

error:
downloadable font: rejected by sanitizer (font-family: «FontAwesome» style:normal weight:normal stretch:normal src index:1) source: https://reports3.wagtailanalytics.com/css/foaw4.5/fonts/fontawesome-webfont.woff2

@font-face {
font-family: «FontAwesome»;
font-style: normal;
font-weight: …

font-aw…min.css (line 4, col 14)

Apparently you get this issue in Firefox is you run out of memory.

Mozilla Support

Error: downloadable font: rejected by sanitizer

Chosen Solution

You get this error if you run out of memory when loading the fontfile or if there is something wrong with the layout (contents) of the fontfile. This is a protection against bad or malicious font files. It is probably possible to disable the sanitizer by setting the pref gfx.downloadable_fonts.sanitize to false in about:config but then you are no longer protected. Use at your own risk. Do not blame Mozilla if you are infected with malware.

Side note…

You can embed code like so…

 | ```css
 | @font-face {
 |     font-family: "FontAwesome";
 |     font-style: normal;
 |     font-weight: ...
 | }
 | ```

_{Note: Ignore the | (pipes) in the markdown…}

Which results in:

@font-face {
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: ...
}

but don’t get the error if I use 4.2. I also upgraded Firefox to the latest version and restart it and same error exists.

Sorry, cannot confirm.

Been using the fonts for a while but yesterday I upgraded from 4.2 to 4.5 and noticed in firefoxs console an error appears which did not before. If I put 4.2 back the error does not show in firefox.

Self hosting? CDN? 4.2.0 didn’t support woff2, which was introduced in 4.3.0. maybe there is something to do with mime types #4261

Feel free to discuss this issue but I’m going to close this one

Ah ok I got it, your comment about woff2 got me looking into mime types and the webserver was setup for woff only so added woff2 and all good now.

Thanks

you’re welcome, glad you solved

Источник

0

1

Пытаюсь загрузить так:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
   @font-face {
    font-family: font1;
    src: url('./font1.ttf');
   }
   h1 {
    font-family: font1;
   }
  </style>
</head>
<body>
<h1>&#xDEA0;&#xDEA1;</h1>
</body>
</html>

ничего не выходит — отображаются ромбики вместо символов из шрифта… (глифы в шрифте имеют коды как написано — xDEA0 и xDEA1)

Пробовал смотреть Tools->Web Developer->WebConsole — ничего такого особенного не видно. Просто в консоли (из которой запущен FF) — тоже ничего нет.

UPD1:

Если заменить имя шрифта на неправильное (fonyt1.ttf), то в web-консоли выдаётся ошибка:

downloadable font: download failed (font-family: "font1" style:normal weight:normal stretch:normal src index:0): status=2147500037
source: file:///home/StrongDollar/Public/fonyt1.ttf

UPD2:

Если заменить коды символов на Ð и Ñ, то в броузере отображаются ÐÑ, вместо моих символов.

UPD3:
нашел ещё две фичи:

1) By default, Firefox will only accept relative links. Firefox (which supports @font-face from v3.5) does not allow cross-domain fonts by default. This means the font must be served up from the same domain (and sub-domain) unless you can add an “Access-Control-Allow-Origin” header to the font.

2) Turns out there is a hidden preference in Firefox that needs to be checked in order for Firefox to display custom fonts on a web page.

Firefox Preferences > Content > Fonts & colors > Advanced button > and check the box «Allow pages to use their own fonts, instead of my selections above»

однако, у меня галочка эта стоит, а файл лежит в той же директории, то есть локально, то есть никаких cross-domain…

UPD4:

Параметр «security.fileuri.strict_origin_policy» True (по умолчанию) в конфигурации настройки указывает что:
Локальные документы имеют доступ к другим локальным документы в том же каталоге и в подкаталогах, но не в верхних разделах. (По умолчанию)

Local documents have access to other local documents in the same directory and in subdirectories, but not directory listings. (Default)

При отключенном параметре «security.fileuri.strict_origin_policy» (False):
Локальные документы имеют доступ к другим локальным документы в том же каталоге и в подкаталогах, и в верхних разделах.

Local documents have access to all other local documents, including directory listings.

У меня каталог тот же, а не выше/ниже, так что должно работать без перенастроек…

UPD5:

если я пишу src: url(‘font1.svg#font1’) format(‘svg’);

то выдается ошибка:

downloadable font: no supported format found (font-family: "font1" style:normal weight:normal stretch:normal src index:1)

про поддержку svg в FF:

https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/SVG_fonts

Источник

Недавно у меня была проблема со шрифтом значка пакета npm
bootstrap-iconsверсия 1.5.0 на сервере. Я использую классы иконок и обертываю их собственными именами классов в SCSS.

Решением для меня было переопределить семейство шрифтов начальной загрузки, а также скопировать и переименовать файлы шрифтов в проект. Так это выглядит в
styles.scss нравится:

      @font-face {
  font-family: "bootstrap-icons-redef";
  src: url("../assets/fonts/bootstrap-icons-redef.woff2") format("woff2"),
  url("../assets/fonts/bootstrap-icons-redef.woff") format("woff");
}

Небольшой недостаток этого решения в том, что мне нужно проверять
node_modules/bootstrap-icons/font/bootstrap-icons.css при каждом обновлении, чтобы убедиться, что мое переопределение все еще синхронизируется с файлом выше.

Источник

Go to css

Error: «downloadable font download failed»

It’s an error from firefox

and I get this when using chrome «Failed to load resource: net::ERR_FILE_NOT_FOUND»

What am I doing wrong? I keep getting this error when trying to use downloaded font. I’m still a newbie, but I’m pretty sure I’m doing this right. Someone please help? This is driving me nuts

@font-face {
font-family: '20_dbregular';
src: url('../fonts/20db-webfont.eot');
src: url('../fonts/20db-webfont.eot?#iefix') format('embedded-opentype'),
     url('../fonts/20db-webfont.woff2') format('woff2'),
     url('../fonts/20db-webfont.woff') format('woff'),
     url('../fonts/20db-webfont.ttf') format('truetype'),
     url('../fonts/20db-webfont.svg#20_dbregular') format('svg');
font-weight: normal;
font-style: normal;

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

}

h1{
font-family: 'deutsch_gothicnormal'; 
}

h2{
font-family: '20_dbregular';
}

Источник