时间戳

首页 > 解决方案 > failed to download decoded font Roboto-Regular-webfont

javascript - failed to download decoded font Roboto-Regular-webfont

问题描述

Facing issues while downloading the font for the first time(after clearing cache), post reloading for 2/3 times error is not there and font loaded properly.

Failed to decode downloaded font: /Roboto-Regular-webfont.ttf /Roboto-Bold-webfont.ttf

As per research tried few workarounds but still facing the issue

  1. tried updating the format('woff') to format('font-woff')
  2. tried with absolute url : https://example.com/Roboto-Regular-webfont.ttf

标签： javascripthtmljquerycssfont-face

解决方案

我假设您想自己托管字体。

最简单的方法是使用 google webfonts 助手：https ://google-webfonts-helper.herokuapp.com/fonts/roboto?subsets=latin

在您的情况下，这样的事情就足够了：

/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('roboto-v27-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('roboto-v27-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('roboto-v27-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('roboto-v27-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('roboto-v27-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('roboto-v27-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

您可以从 google-webfonts-helper 或直接从 google 字体下载文件。

推荐阅读