我在开发微信小程序的遇到的几个问题,记录一下:
wx.loadFontFace官方文档

如果字体包加载失败了,微信开发者只会返回{"status":"error","errMsg":"loadFontFace:fail "},并不清楚是什么原因导致的。
我遇到过字体链接不是https的,让后端返回https的就好了。
还遇到过字体在安卓里面不生效,查找了问题:"nginx需要配置字体支持跨域",请后端帮忙配置一下。
我还遇到过都不是上面的两种情况,按照官网的所有配置都是没有问题的,但是就是显示不出来,怀疑是字体包的问题,但是又找不到理由。
后来请教了同事,让我把有问题的字体放在本地的html文件里面跑一下,看看生不生效。就像这样:

html里面这样写:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    @font-face {
      font-family: 'HYZhongSongJ';
      src: url('q.ttf') format('truetype');
    }

    div {
      font-family: 'HYZhongSongJ';
    }
  </style>
</head>

<body>
  <div>哈哈哈哈 1234 ttt</div>


</body>

</html>

字体也是不生效的。然后看到控制台发现了一个提示“Failed to decode downloaded font”(解码下载的字体失败)

后来又用好的字体包实验了一下,字体生效,并且控制台没有任何的报错提示。
那就找到了问题,字体包本身就是坏掉的,后来下载了另一个字体包,渲染成功了。
这就是我在微信小程序里面开发字体包遇到的问题。


我的一个道姑朋友
80 声望4 粉丝

星光不问赶路人,岁月不负有心人。