小程序loadFontFace第三方字体基于七牛云配置cors

微信小程序的开发在如今大环境下越来越频繁,而围绕微信小程序的各类功能也逐渐丰富起来。

对网站的美化来说,部分设计不在局限于系统默认字体而是采用第三方字体使页面更加的个性化。

那么在小程序中我们要如何使用第三方字体呢?当字体放置在七牛云时又该如何配置才能正确使用呢?

了解过第三方字体使用的都清楚,在微信小程序中对于第三方字体的引用有着严苛的要求。如下:

字体链接必须是同源下的,或开启了cors支持,小程序的域名是servicewechat.com

接下来,我们就来跟随文章了解如何在七牛云中开启了cors支持。

一、开启cors

    1.1、登录七牛云网站,从控制台中进入网站对应的存储空间

https://www.qiniu.com/

    1.2、如图所示,空间管理、空间设置中的跨域设置点击。


    1.3、点击“新增规则”,弹出规则配置弹框。

二、规则的配置

    如图,配置配置小程序域名。将允许Methods全部勾选。

https://servicewechat.com


三、获取字体外链

    如图,选择你上传的字体文件,点击文件详情。文件链接即为外链。


六月初字帖坊小程序 你想要的字帖模板及工具,这里都有!