小程序动态加载网络字体

小程序字体到目前为止有两种方式，一种下载好转base64 贴在公共样式里引用，另外一种就是动态加载字体了，转64的方法首先不说麻烦，其次也占内存，小程序一共只能那么几m这么折腾无疑不是最好的选择，故首选动态加载。
js部分在onload中写下

  wx.loadFontFace({
          family: 'webfont',
          source: 'url("//at.alicdn.com/t/webfont_1f7b3qbimiv.eot")',
          success: function (res) {
              console.log(res.status) //  loaded
          },
          fail: function (res) {
              console.log(res.status) //  error
          },
          complete: function (res) {
              console.log(res.status);
          }
      });

这里引入的是阿里的思源黑体 family是自定义名字 source是地址。
小程序api上 动态加载网络字体，文件地址需为下载类型。IOS下仅支持https格式文件地址。
阿里的//因为如果地址是//开头，浏览器加载就会以当前的http前缀为基准。换句话说如果当前网页是http的，字体就会以http加载，当前网页是https的，字体就会以https加载。所以可以放心使用。
在公共样式表里写下

/* 字体 */
.web-font{
    font-family:"webfont" !important;
    font-size:16px;font-style:normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
}

最后直接在class中写上web-font就可以实现字体加载了，方便了很多。