首页 > 编程语言 >微信小程序字体在部分真机失效解决办法

微信小程序字体在部分真机失效解决办法

时间:2023-08-28 14:57:43浏览次数:36  
标签:解决办法 真机 微信 域名 字体 CORS ttf 加载

uniapp 微信小程序字体加载

1、使用 uni.loadFontFace

uni.loadFontFace({
  global: true, // 开启全局生效
   family: 'PingFang SC',
   source: 'url("https://fonts/xs.ttf")',
   success() {
     console.log('success')
   },
   fail(e) {
     console.log('err:',e)
   }
 })

注意:

  1. 格式支持常见的基本所有类型(ttf、woff、woff2(web主流)、otf、sfnt),建议格式为 TTF 和 WOFF(推荐),WOFF2 在低版本的 iOS 上会不兼容。
  2. 字体链接仅支持https链接
  3. 字体链接访问需满足浏览器同源策略,字体文件资源设置CORS的Access-Control-Allow-Origin为小程序域名:servicewechat.com或者*才可以。
经过测试,ios和小米手机对于未设置CORS的字体文件仍然可以正常加载,荣耀和vivo无法正常加载,需要设置正确的CORS即可正常加载
  1. 在加载成功之后,会自动刷新字体显示
  2. 不需要设置downloadFile合法域名及业务域名。

解决办法:

修改 nginx 配置

  

location ~ .*\.(eot|otf|ttf|woff|woff2|svg)$
{
  add_header Access-Control-Allow-Origin *;
}

 

标签:解决办法,真机,微信,域名,字体,CORS,ttf,加载
From: https://www.cnblogs.com/caihongmin/p/17662244.html

相关文章

  • ☀️Navicat连接Oracle:'ORA-12638: Credential retrieval failed' 解决办法
    前言:我们在使用Navicat连接Oracle数据库的时候,需要oci.dll动态链接库,Navicat16在安装时候已经自带了。我在之前使用一直好好的,就今天需要连一个新项目的Oracle,报错了:ORA-12638:Credentialretrievalfailed',如下:解决:通过同事口中得知,要连接的Oracle版本是:12c(12.2.0.1.0),而......
  • MyEclipse中使用复制粘贴功能卡的解决办法
    最近在MyEclipse中编辑代码时,使用快捷键进行复制粘贴,经常会导致编辑器短暂的停顿,光标不跟随,居然反应不过来,几近假死。想来想去应该是编辑上的什么配置或者是IDE的什么功能导致,于是进入Preferences查找edit功能,进行一个个的测试,最后发现原来是代码的超链功能导致。 进入方法:Window......
  • 关注微信公众号推送消息
    微信关注二维码的主要开发思路:第一步,向用户展示要扫的二维码:通过提前申请的appid和秘钥去拿token,通过token再去微信服务上拿要关注的图片二维码,将二维码展示在你系统中。第二步,用户扫码:用户扫码时会向微信发信息,并且微信会回调你的自己的服务,需要你将关注的用户信息保存下来;......
  • 手把手教你如何实现企业微信Jenkins 构建发布通知
    一.前言在企业项目发版本过程中,以Jenkins为例,个别项目构建时间较长,不想时刻关注构建情况,或构建成功后移交其他人继续处理,需要配置企业微信通知功能,本篇主要是针对pipeline流水线项目,如何实现Jenkins构建成功与否通知到消息至企业微信指定人二.实现过程2.1企业微信创建机器人这里采......
  • SpringBoot启动时:Process finished with exit code 0解决办法
    Processfinishedwithexitcode0并不是报错了,这个表示程序正常执行完毕退出了。这就表示项目启动成功后了,此时运行,最后运行完毕自动退出。但我们是需要访问路径的,所以需要引入webjar包<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot......
  • 微信小程序 type="nickname" 点击后,获取不到最新值
    在uniapp开发微信小程序,或是使用小程序开发平台开发,会涉及到获取用户的头像和昵称,而在最新的微信小程序基础库,getUserInfo等不能在获取这些信息,官方推荐使用头像昵称填写能力(基础库2.21.2版本开始支持,覆盖iOS与安卓微信8.0.16以上版本),下面讲讲我在使用过程中遇到的问题。<bu......
  • vue微信H5项目使用腾讯地图获取当前位置经纬度
    1.在index.html引入js文件<scriptsrc="https://3gimg.qq.com/lightmap/components/geolocation/geolocation.min.js"></script>2.在需要页面中你自己的key要去腾讯地图工具去申请https://lbs.qq.com/webApi/component/componentGuide/componentPickercreated(){this.getM......
  • Winform微信扫码支付
    微信扫码支付引用的是第三方的:Senparc.Weixin引用:usingSenparc.Weixin.MP.TenPayLibV3;首先,在Form_Load里面调用生成支付二维码的方法:///<summary>///Form_Load事件///</summary>///<paramname="sender"></param>///<......
  • 微信开发之一键邀请好友加入群聊的技术实现
    邀请群成员(开启群验证)若群开启邀请确认,仅能通过本接口邀请群成员请求URL:http://域名/addChatRoomMemberVerify请求方式:POST请求头Headers:Content-Type:application/jsonAuthorization:login接口返回参数:参数名必选类型说明wId是String登录实例标识chatRoomId是String群iduserList是nu......
  • 微信开发之一键修改群聊备注的技术实现
    修改群备注修改群名备注后,如看到群备注未更改,是手机缓存问题,可以连续点击进入其他群,在点击进入修改的群,再返回即可看到修改后的群备注名,群名称的备注仅自己可见请求URL:http://域名地址/modifyGroupRemark请求方式:POST请求头Headers:Content-Type:application/jsonAuthorization:login......