Не удалось декодировать загруженный шрифт

Ответ 1

В правиле CSS вы должны добавить расширение файла. Этот пример с самой глубокой возможной поддержкой:

@font-face {
  font-family: 'MyWebFont';
  src: url('webfont.eot'); /* IE9 Compat Modes */
  src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

РЕДАКТИРОВАТЬ:

"Не удалось декодировать загруженный шрифт" означает, что шрифт поврежден или неполон (отсутствуют метрики, необходимые таблицы, записи имен, миллион возможных вещей).

Иногда эта проблема вызвана самим шрифтом. Шрифт Google предоставляет правильный шрифт, который вам нужен, но если необходим шрифт, я использую Transfonter для генерации всех форматов шрифтов.

Иногда FTP-клиент повреждает файл (не в этом случае, потому что он находится на локальном компьютере). Обязательно передайте файл в двоичном формате, а не в ASCII.

Ответ 2

Изменение формата ('woff') в формате ('font-woff') поможет мне решить эту проблему только сейчас.

Просто измените здесь небольшое изменение от ответа Германо Плебани

 @font-face {
  font-family: 'MyWebFont';
  src: url('webfont.eot'); /* IE9 Compat Modes */
  src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('webfont.woff') format('font-woff'), /* Pretty Modern Browsers */
       url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

Пожалуйста, проверьте, могут ли ваши источники браузера открыть его и какой тип

Ответ 3

У меня возникла аналогичная проблема в Visual Studio, которая была вызвана неправильным способом url() к рассматриваемому шрифту.

Я перестала получать эту ошибку после изменения (например):

@@font-face{
    font-family: "Example Font";
    src: url("/Fonts/ExampleFont.eot?#iefix");

:

@@font-face{
    font-family: "Example Font";
    src: url("../fonts/ExampleFont.eot?#iefix");

Ответ 4

Убедитесь, что ваш сервер отправляет файлы шрифтов с правильным типом/типом.

Недавно у меня такая же проблема, используя nginx, потому что некоторые типы шрифтов шрифтов отсутствуют из его vanilla /etc/nginx/mime.types файл.

Я исправил проблему с добавлением отсутствующих типов mime в том месте, где они мне были нужны:

location /app/fonts/ {

  #Fonts dir
  alias /var/www/app/fonts/;

  #Include vanilla types
  include mime.types;

  #Missing mime types
  types  {font/truetype ttf;}
  types  {application/font-woff woff;}
  types  {application/font-woff2 woff2;}
}

Вы также можете проверить это для расширения mime.types в nginx: расширение файла nginx mime.types по умолчанию

Ответ 5

Мне пришлось добавить type="text/css" в свой тег link. Я изменил его:

<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700" rel="stylesheet">

в

<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700" rel="stylesheet" type="text/css">

После того, как я сменил его, ошибка исчезла.

Ответ 6

У меня была такая же проблема и она была решена, изменив

src: url("Roboto-Medium-webfont.eot?#iefix")

к

src: url("Roboto-Medium-webfont.eot?#iefix") format('embedded-opentype')

Ответ 7

Иногда эта проблема возникает при загрузке/загрузке шрифтов с использованием неправильного метода FTP. Шрифты должны быть FTP-ed с использованием двоичного метода, а не ASCII. (В зависимости от вашего настроения, это может показаться противоречивым, lol). Если вы используете файлы шрифтов с использованием метода ASCII, вы можете получить это сообщение об ошибке. Если вы ftp ваши файлы с помощью метода "auto", и вы получите это сообщение об ошибке, попробуйте ftp, принудительно использующий двоичный метод.

Ответ 8

Для меня эта ошибка возникала, когда я ссылался на шрифт google с помощью https. Когда я переключился на http, ошибка исчезла. (и да, я попробовал это несколько раз, чтобы подтвердить, что это было причиной)

Итак, я изменил:

@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,100,500,900);

To:

@import url(http://fonts.googleapis.com/css?family=Roboto:300,400,100,500,900);

Ответ 9

У меня была такая же проблема с шрифтом awesome v4.4, и я исправил его, удалив формат woff2. Я получал предупреждение только в Chrome.

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.4.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

Ответ 10

В моем случае это было вызвано неправильным файлом пути, в .htaccess. проверьте правильность пути к файлу.

Ответ 11

Иногда эта проблема возникает при загрузке/загрузке шрифтов с использованием неправильного метода FTP. Шрифты должны быть FTP-ed с использованием двоичного метода, а не ASCII. (В зависимости от вашего настроения, это может показаться противоречивым, lol). Если вы используете файлы шрифтов с использованием метода ASCII, вы можете получить это сообщение об ошибке. Если вы загружаете файлы с помощью метода "auto", и вы получаете это сообщение об ошибке, попробуйте ftp, принудительно использующий двоичный метод

Ответ 12

Для меня ошибка заключалась в том, что я забыл поместить FTP в двоичный режим перед загрузкой файлов шрифтов.

Edit

Вы можете проверить это, загрузив другие типы двоичных данных, таких как изображения. Если они также не отображаются, это может быть вашей проблемой.

Ответ 13

У меня также была такая же проблема, но я решил, добавив "Content-Type": "application/x-font-ttf" в заголовке ответа для всех файлов .ttf.

Ответ 14

В моем случае это было вызвано созданием файла патча SVN, который включал добавление файлов шрифтов. Например:

• Добавить файлы шрифтов из локальной файловой системы в субперспективную магистраль
• Магистраль работает как ожидалось
• Создайте патч SVN для изменения соединительных линий, чтобы добавить файлы шрифтов.
• Применить патч к другой ветке
• Файлы шрифтов добавляются в subversioned branch (и могут быть зафиксированы), но повреждены, что дает ошибку в OP.

Решением было загрузить файлы шрифтов непосредственно в ветку из локальной файловой системы. Я предполагаю, что это произошло из-за того, что файлы патча SVN должны преобразовывать все в формат ASCII и не обязательно сохранять двоичные файлы шрифтов. Но это только предположение.

Ответ 15

В моем случае при загрузке шаблона файлы шрифтов были просто пустыми. Вероятно, проблема с загрузкой. Chrome дал эту общую ошибку. Сначала я подумал, что решение о переходе от woff к font-woff решило его, но это только заставило Chrome игнорировать шрифты. Мое решение заключалось в поиске шрифтов один за другим и их загрузке/замене.

Ответ 16

В моем случае - используя React с Гэтсби - проблема была решена двойной проверкой всех моих путей. Я использовал React/Gatsby с Sass, и исходные файлы Gatsby искали шрифты в другом месте, чем скомпилированные файлы. После того, как я продублировал файлы в каждом пути, эта проблема исчезла.

Ответ 17

Если вы используете экспресс, вам нужно разрешить показ статического контента, добавив что-то вроде: var server = express(); server.use(express.static( './общественности'));//где public - это корневая папка приложения с содержащимися в ней шрифтами на любом уровне, то есть public/fonts или public/dist/fonts... // Если вы используете connect, google для аналогичной конфигурации.

Ответ 18

Я использую.Net Framework 4.5/IIS 7

Чтобы исправить это, я поместил файл Web.config в папку с файлом шрифта.

Содержимое Web.config:

<?xml version="1.0"?>
<configuration>
  <system.web>
    <authorization>
      <allow users="*" />
    </authorization>
  </system.web>
</configuration>

Ответ 19

Переход от формата ('woff') в формат ('font-woff') поможет мне точно!

@font-face {font-family: 'MyWebFont';

src: url('webfont.eot'); src: url ('webfont.eot'); /* IE9 Compat Modes *//* Режимы подключения IE9 */

src: url('webfont.eot?#iefix') format('embedded-opentype'),/* IE6-IE8 */ src: url ('webfont.eot? #iefix') format ('embedded-opentype'),/* IE6-IE8 */

   url('webfont.woff2') format('woff2'), /* Super Modern Browsers */

   url('webfont.woff') format('font-woff'), /* Pretty Modern Browsers */

   url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */

   url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */

   url('webfont.woff2') format('woff2'), /* Super Modern Browsers */

   url('webfont.woff') format('font-woff'), /* Pretty Modern Browsers */

   url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */

   url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */

} }

Ответ 20

для меня это была проблема с файлами lfs, которые не были загружены

git lfs fetch --all

исправил проблему.

см. https://github.com/git-lfs/git-lfs/issues/325.

Ответ 21

У меня есть проблема на моем веб-сайте, не удалось декодировать загружаемый шрифт mediaelement.min.js: 12 Не удалось декодировать загруженный шрифт: https://gpsupdate.online/fonts/font-awesome/fontawesome-webfont3e6e-v=4.7.0.html кто-нибудь может мне помочь...... OTS ошибка разбора: неверный тег версии

Ответ 22

Если он находится на сервере (не на локальном хосте), попробуйте загрузить шрифты вручную, потому что иногда FTP-клиент (например, FileZilla) портит файлы, и это может вызвать проблему. Для меня я загрузил вручную, используя интерфейс Cpanel.