使用外部字体时,显示正常,但开发者工具客户端却报错
Failed to load font https://xxx/1.ttf
net::ERR_CACHE_MISS
客户端用法:
在app.wxss引入外部字体,如下所示
@font-face {
font-family: 'MyFont';
src: url('https://xxx/1.ttf');
font-weight: normal;
font-style: normal;
}
腾讯云服务器用法:
服务器创建static目录,下面放静态文件1.ttf,通过中间件koa-static访问
请问怎样才能不报错。
朋友们,终极解决方案来了。
把ttf字体(woff格式的也可以)转换成base64格式 解决了这个问题。
这个是字体转base64格式的网址:https://transfonter.org/
这一次再次编译就不会有报错提示了。
我也遇到了这个问题。找到了两种解决方案:
将字体文件转换成base64的css文件使用,但是体积会变大很多。(转换工具:https://transfonter.org/)
使用loadFontFace这个api来加载外链图片。(文档参考:https://developers.weixin.qq.com/miniprogram/dev/api/wx.loadFontFace.html)
我最后选的是方案2,使用成本低,而且不占用小程序包的大小。