Сделать шрифты Adobe работать с CSS3 @ font-face в IE9

Я занимаюсь созданием небольшого приложения для интрасети и стараюсь, если не повезло, использовать шрифт Adobe, который я приобрел в последнее время. Как мне сообщили, в нашем случае это не является нарушением лицензии.

Я преобразовал версии .ttf / .otf шрифта в .woff, .eot и .svg, чтобы настроить таргетинг на все основные браузеры. Синтаксис @ font-face, который я использовал, в основном пуленепробиваемый из Font Spring :

@font-face { font-family: 'MyFontFamily'; src: url('myfont-webfont.eot'); src: url('myfont-webfont.eot?#iehack') format('eot'), url('myfont-webfont.woff') format('woff'), url('myfont-webfont.ttf') format('truetype'), url('myfont-webfont.svg#svgFontName') format('svg'); } 

Я изменил заголовки HTTP (добавил Access-Control-Allow-Origin = “*”), чтобы разрешить междоменные ссылки. В FF и Chrome он отлично работает, но в IE9 я получаю:

 CSS3111: @font-face encountered unknown error. myfont-webfont.woff CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable. myfont-webfont.ttf 

Я заметил, что при преобразовании шрифта из .ttf / .otf в .woff я также получаю файл .afm , но я не знаю, важно это или нет …

Любые идеи, как это сделать?

[Изменить] – Я размещаю свои сайты (шрифты тоже, но под отдельным каталогом и субдоменом для статического контента) в IIS 7.5

Я могу только объяснить вам, как исправить ошибку «CSS3114».
Вы должны изменить уровень внедрения вашего TTF-файла.

Используя соответствующий инструмент, вы можете установить его для разрешимого внедрения .
Для 64-разрядной версии проверьте ответ @ user22600.

Вы должны установить формат шрифта ie для «embedded-opentype», а не «eot». Например:

 src: url('fontname.eot?#iefix') format('embedded-opentype') 

Как сказал Кну, вы можете использовать этот инструмент , однако он скомпилирован только для MS-DOS. Я скомпилировал его для Win64. Скачать .

Применение:

  1. Поместите файл .exe в ту же папку, что и шрифт, который необходимо изменить.

  2. Перейдите в этот каталог в командной строке

  3. type embed fontname.fonttype , заменив имя шрифта на имя файла и тип шрифта на расширение, т.е. embed brokenFont.ttf

  4. Все сделано! Теперь ваш шрифт должен работать.

Я получил следующую ошибку:

CSS3114: @ font-face не удалось выполнить проверку разрешений OpenType. Разрешение должно быть установлено.
fontname.ttf

После использования приведенного ниже кода моя проблема была решена ….

 src: url('fontname.ttf') format('embedded-opentype') 

Спасибо, ребята, за помощь!
Ура,
Renjith.

Попробуйте это, добавьте эти строки в web.config.

      

Другой ответ: правовые вопросы.

Перед тем, как вы это сделаете, нужно сделать пару вещей. Во-первых, чтобы получить эту ошибку, в IE, проверить элемент, переключить свои вкладки и искать ошибки, я считаю, что «CSS3114» появляется в консоли.

То, что вам нужно понять, это проблема лицензирования. IE (каламбур), если вы пытаетесь загрузить шрифт, который вызывает эту ошибку, у вас нет прав на использование шрифта, и если у вас нет разрешения, весьма вероятно, что вы можете потерять (что само маловероятно), используя этот шрифт таким образом, если вы не держите лицензию. Итак, вы можете в первый раз поблагодарить IE за то, что он единственный браузер, который сказал вам «нет», потому что он по крайней мере позволяет вам знать, что вы делаете что-то сомнительное.

Тем не менее, вот ваш ответ:

Сначала убедитесь, что вы используете лучший код в .css, см. Некоторые другие ответы css для этого.
Пример IE 11 css (во всех современных браузерах, возможно, потребуется настроить для IE9):

 @font-face { font-family: "QuestionableLegalFont"; font-weight: bold; src: url('../fonts/QuestionableLegalFont.ttf') format('truetype'); } 

Затем убедитесь, что у вас есть рабочий веб-шрифт (вы, вероятно, уже знаете это, видя свой шрифт в других браузерах). Если вам нужен онлайн-конвертер шрифтов, проверьте здесь: https://onlinefontconverter.com/

Наконец, Чтобы избавиться от ошибки «CSS3114». Для онлайн-инструмента нажмите здесь: https://www.andrebacklund.com/fontfixer.html

Верно, что IE9 требует, чтобы шрифты TTF имели биты внедрения, установленные в Installable. Генератор делает это автоматически, но в настоящее время мы блокируем шрифты Adobe по другим причинам. Мы можем снять это ограничение в ближайшем будущем.

Из-за этой проблемы я потратил много времени. Наконец, я нашел отличное решение. Раньше я использовал только шрифт .ttf. Но я добавил один дополнительный формат шрифта., Который начал работать в IE.

Я использовал следующий код, и он работал как прелесть во всех браузерах.

 @font-face { font-family: OpenSans; src: url(assets/fonts/OpenSans/OpenSans-Regular.ttf), url(assets/fonts/OpenSans/OpenSans-Regular.eot); } @font-face { font-family: OpenSans Bold; src: url(assets/fonts/OpenSans/OpenSans-Bold.ttf), url(assets/fonts/OpenSans/OpenSans-Bold.eot); } 

Надеюсь, это поможет кому-то.

Как пользователь Mac, я не смог использовать инструменты командной строки MS-DOS и Windows, которые были упомянуты, чтобы исправить разрешение на размещение шрифтов. Однако я выяснил, что вы можете исправить это, используя FontLab, чтобы установить разрешение «Все разрешено». Я надеюсь, что этот рецепт о том, как установить разрешение шрифта на Installable в Mac OS X , также полезен и для других.

Если вы знакомы с nodejs / npm, ttembed-js – это простой способ установить флаг «устанавливаемый встраиваемый разрешенный» на шрифт TTF. Это изменит указанный файл .ttf:

 npm install -g ttembed-js ttembed-js somefont.ttf 

Проблема может быть связана с конфигурацией вашего сервера – возможно, он не отправляет правильные заголовки для файлов шрифтов. Взгляните на ответ, заданный для вопроса IE9, загружающий загрузку кросс-исходного веб-шрифта .

EricLaw предлагает добавить в конфигурацию Apache следующее:

   Header set Access-Control-Allow-Origin "http://mydomain.com"   

Для всех, кто получает сообщение об ошибке: «tableversion должно быть 0, 1 или или hex: 003» при использовании ttfpatch, я скомпилировал embed для 64-битного. Я ничего не изменил, просто добавил необходимые библиотеки и скомпилировал их. Используйте на свой страх и риск.

Использование: ConsoleApplication1 font.ttf

http://www.mediafire.com/download/8x1px8aqq18lcx8/ConsoleApplication1.exe

Если вы хотите сделать это с помощью PHP-скрипта вместо того, чтобы запускать C-код (или вы на Mac, как я, и вы не можете быть arsed компиляции с Xcode только ждать год, чтобы он был открыт), вот Функция PHP, которую вы можете использовать для удаления разрешений вложения от шрифта:

 function convertRestrictedFont($filename) { $font = fopen($filename,'r+'); if ($font === false) { throw new Exception('Could not open font file.'); } fseek($font, 12, 0); while (!feof($font)) { $type = ''; for ($i = 0; $i < 4; $i++) { $type .= fgetc($font); if (feof($font)) { fclose($font); throw new Exception('Could not read the table definitions of the font.'); } } if ($type == 'OS/2') { // Save the location of the table definition // containing the checksum and pointer to the data $os2TableDefinition = ftell($font); $checksum = 0; for ($i = 0; $i < 4; $i++) { fgetc($font); if (feof($font)) { fclose($font); throw new Exception('Could not read the OS/2 table header of the font.'); } } // Get the pointer to the OS/2 table data $os2TablePointer = ord(fgetc($font)) << 24; $os2TablePointer |= ord(fgetc($font)) << 16; $os2TablePointer |= ord(fgetc($font)) << 8; $os2TablePointer |= ord(fgetc($font)); $length = ord(fgetc($font)) << 24; $length |= ord(fgetc($font)) << 16; $length |= ord(fgetc($font)) << 8; $length |= ord(fgetc($font)); if (fseek($font, $os2TablePointer + 8, 0) !== 0) { fclose($font); throw new Exception('Could not read the embeddable type of the font.'); } // Read the fsType before overriding it $fsType = ord(fgetc($font)) << 8; $fsType |= ord(fgetc($font)); error_log('Installable Embedding: ' . ($fsType == 0)); error_log('Reserved: ' . ($fsType & 1)); error_log('Restricted License: ' . ($fsType & 2)); error_log('Preview & Print: ' . ($fsType & 4)); error_log('Editable Embedding: ' . ($fsType & 8)); error_log('Reserved: ' . ($fsType & 16)); error_log('Reserved: ' . ($fsType & 32)); error_log('Reserved: ' . ($fsType & 64)); error_log('Reserved: ' . ($fsType & 128)); error_log('No subsetting: ' . ($fsType & 256)); error_log('Bitmap embedding only: ' . ($fsType & 512)); error_log('Reserved: ' . ($fsType & 1024)); error_log('Reserved: ' . ($fsType & 2048)); error_log('Reserved: ' . ($fsType & 4096)); error_log('Reserved: ' . ($fsType & 8192)); error_log('Reserved: ' . ($fsType & 16384)); error_log('Reserved: ' . ($fsType & 32768)); fseek($font, ftell($font) - 2); // Set the two bytes of fsType to 0 fputs($font, chr(0), 1); fputs($font, chr(0), 1); // Go to the beginning of the OS/2 table data fseek($font, $os2TablePointer, 0); // Generate a new checksum based on the changed for ($i = 0; $i < $length; $i++) { $checksum += ord(fgetc($font)); } fseek($font, $os2TableDefinition, 0); fputs($font, chr($checksum >> 24), 1); fputs($font, chr(255 & ($checksum >> 16)), 1); fputs($font, chr(255 & ($checksum >> 8)), 1); fputs($font, chr(255 & $checksum), 1); fclose($font); return true; } for ($i = 0; $i < 12; $i++) { fgetc($font); if (feof($font)) { fclose($font); throw new Exception('Could not skip a table definition of the font.'); } } } fclose($font); return false; } 

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

Исходный источник в C можно найти здесь .

Вы можете решить это, следуя коду

 @font-face { font-family: 'Font-Name'; src: url('../fonts/Font-Name.ttf'); src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype'); } 

Я нашел, eot файл eot должен быть помещен за пределы ttf . Если он находится под ttf , подумал, что шрифт отображается правильно, IE9 все равно выдаст ошибку.

Рекомендовать:

 @font-face { font-family: 'Font-Name'; src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype'); src: url('../fonts/Font-Name.ttf') format('truetype'); } 

Не рекомендуется:

 @font-face { font-family: 'Font-Name'; src: url('../fonts/Font-Name.ttf') format('truetype'); src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype'); } 

Я попробовал инструмент ttfpatch, и это не сработало. Internet Exploder 9 и 10 по-прежнему жаловались.

Я нашел этот красивый Git gist, и он решил мои проблемы. https://gist.github.com/stefanmaric/a5043c0998d9fc35483d

Просто скопируйте и вставьте код в свой css.

Недавно я столкнулся с этой проблемой с помощью .eot и .otf шрифтов, создающих ошибки CSS3114 и CSS3111 в консоли при загрузке. Решение, которое работало для меня, состояло в том, чтобы использовать только форматы .woff и .woff2 с откатком формата .ttf. Форматы .woff будут использоваться до .ttf в большинстве браузеров и, похоже, не вызовут проблему разрешения вложений в шрифт (css3114) и проблему с неправильным форматом имен шрифтов (css3111). Я нашел свое решение в этой чрезвычайно полезной статье о проблеме CSS3111 и CSS3114 , а также прочитал эту статью об использовании @ font-face .

Примечание. Это решение не требует повторной компиляции, преобразования или редактирования любых файлов шрифтов. Это css-единственное решение. У шрифта, который я тестировал, были выпущены версии .eot, .otf, .woff, .woff2 и .svg, вероятно, из исходного источника .ttf, который вызвал ошибку 3114, когда я его попробовал, однако .woff и. Файлы woff2, казалось, были невосприимчивы к этой проблеме.

Это то, что DID работает для меня с @ font-face:

 @font-face { font-family: "Your Font Name"; font-weight: normal; src: url('your-font-name.woff2') format('woff2'), url('your-font-name.woff') format('woff'), url('your-font-name.ttf') format('truetype'); } 

Именно это вызвало ошибки с @ font-face в IE:

 @font-face { font-family: 'Your Font Name'; src: url('your-font-name.eot'); src: url('your-font-name.eot?#iefix') format('embedded-opentype'), url('your-font-name.woff2') format('woff2'), url('your-font-name.woff') format('woff'), url('your-font-name.ttf') format('truetype'), url('your-font-name.svg#svgFontName') format('svg'); } 

Это работает для меня:

 @font-face { font-family: FontName; src: url('@{path-fonts}/FontName.eot?akitpd'); src: url('@{path-fonts}/FontName.eot?akitpd#iefix') format('embedded-opentype'), url('@{path-fonts}/FontName.ttf?akitpd') format('truetype'), url('@{path-fonts}/FontName.woff?akitpd') format('woff'), url('@{path-fonts}/FontName.svg?akitpd#salvage') format('svg'); } 
  • локальное хранилище в IE9 сбой при доступе к веб-сайту непосредственно из файловой системы
  • У IE автономный браузер все еще существует (и работает на Win 7?)
  • PowerShell IE9 ComObject имеет все свойства null после перехода на веб-страницу
  • Как заставить IE открывать JavaScript как текст
  • Сколько времени URL-адрес может получить Internet Explorer 9?
  • Internet Explorer 9, 10 и 11 Конструктор событий не работает
  • css3 text-shadow в IE9
  • Градиентное отклонение IE9 и фоновое gradleиентное кровотечение
  • CORS с jQuery и XDomainRequest в IE8 / 9
  • Internet Explorer 9 Drag and Drop (DnD)
  • Как заблокировать рекламу в Internet Explorer?
  • Interesting Posts

    Подписать CSR с помощью Bouncy Castle

    Как я могу форматировать номер строки, чтобы иметь запятые и круглые?

    Есть ли программное обеспечение для определения того, какое оборудование у меня есть, чтобы я мог найти драйверы для него?

    Хорошее экранное приложение линейки для Windows?

    Какое преимущество дает Монад нам по Прикладной?

    Как большой может быть malloc в C?

    прозрачный статус-бар / system-ui 4.4 Kit Kat

    Могу ли я использовать CGAffineTransformMakeRotation для поворота изображения более чем на 360 gradleусов?

    Запуск двух асинхронных задач параллельно и сбор результатов в .NET 4.5

    Значение ps aux output

    Выбросить ошибку в триггере MySQL

    Вращающееся изображение. Анимационный список или анимированный поворот? (Android)

    Как отключить ViewPager от прокрутки в одном направлении

    Запланированное и повторяющееся письмо в Outlook?

    Невозможно загрузить изображение при выборе из галереи на Android 4.4 (KitKat) с помощью PhoneGap Camera Plugin

    Давайте будем гением компьютера.