webkit对接woff字体

最新推荐文章于 2023-06-05 16:58:10 发布

嘻哈小猴

最新推荐文章于 2023-06-05 16:58:10 发布

阅读量2.2k

点赞数 1

分类专栏： webkit 文章标签： webkit woff

本文链接：https://blog.csdn.net/m632587166/article/details/50856902

版权

webkit 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

Webkit对接Woff字体

最近使用webkit浏览器登录一些网页的时候，发现网页上有好多字体跟我在chrome浏览器或者火狐浏览器上显示都不一样，于是乎深入研究了一下，把页面下载下来，发现某些页面的字体都是自定义的family，然后他们的字库除了ttf格式，还有otf、woff、woff2等。

看webkit代码FontCustomPlatformData.cpp下，在supportsFormat函数里代码如下：

bool FontCustomPlatformData::supportsFormat(constString& format)
{
returnequalIgnoringCase(format, "truetype") || equalIgnoringCase(format,"opentype")
#ifUSE(OPENTYPE_SANITIZER)
        || equalIgnoringCase(format,"woff") //注：这里想要支持woff2字体，ots是支持的，只需要在此处再添加一个条件就可以了，你懂的
#endif
    ;
}

咋一看发现，webkit默认是支持ttf和otf的，至于woff是用OPENTYPE_SANITIZER这个宏给给开了，于是我想抱着侥幸的心态尝试一下，直接在编译选项里面添加这个宏，编译一下试试，以后就大功告成了，结果编译失败！！！

看失败的原因，我找到了这个FontCustomPlatformData.cpp下的createFontCustomPlatformData函数，发现OpenTypeSanitizer这个类，这个类在头文件声明了，没有cpp文件，类里面声明的方法也未实现，一看就知道是个porting，没有开发，既然想要这个，就去网上找呗。于是我直接在网上搜OpenTypeSanitizer.cpp，还真有，是于是把它下载下来，放进去编译，这个文件大家在百度里面搜，第一个就是了。

看这个文件还需要一些头文件

#include"opentype-sanitiser.h"

#include"ots-memory-stream.h"

网上一搜，需要ots库，于是乎又去网上下载了ots源代码，按照INSTALL里面的指示，编译OTS库，编译中libots.so还需要brotli和lzma_sdk三方库，我下载的源代码有lzma_sdk源代码，所以我又去下载了brotli的源代码。发现libots.so只引用到brotli下dec目录下的头文件，于是直接去dec目录编译一个动态库，自己取名叫libdec.so，然后用编过了，最后生成了libots.so和libots_lzma_sdk.so。

编译成功后，将三个库路径和头文件路径添加到webkit配置里，编译完成。

自己写了个简单的测试用例：

<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>无标题文档</title>
</head>
<style>
       .webfont {
              text-align: left;
              font-family: 'Trade Winds';
              width: 173px;
              height: 35px;
              float: left;
              margin-left: 23px;
       }
       @font-face {
               font-family: 'Trade Winds';
               font-style: normal;
               font-weight: 400;
               src:url(http://fonts.gstatic.com/s/tradewinds/v5/P7L1H4TWVDNJivDGg_--QI4P5ICox8Kq3LLUNMylGO4.woff2)format('woff2');
       }
</style>
<body>
       <pclass="webfont">ABCDE</p>
</body>
</html>

发现字体确实跟chrome一样了，大功告成！！！

PS：因为我是linux平台，在CachedFont.cpp文件下的ensureCustomFontData函数，发现传进来的data为wOFF，结果执行完

#if (!PLATFORM(MAC) || __MAC_OS_X_VERSION_MIN_REQUIRED<= 1090) && (!PLATFORM(IOS) || __IPHONE_OS_VERSION_MIN_REQUIRED <80000)
       RefPtr<SharedBuffer> sfntBuffer;
 
        fontIsWOFF= isWOFF(buffer);  //modify byzhongzw@tcl.com 2015.1.11 for not support woff
        if(fontIsWOFF) {
           Vector<char> sfnt;
            if(convertWOFFToSfnt(buffer, sfnt)) {
               sfntBuffer = SharedBuffer::adoptVector(sfnt);
               buffer = sfntBuffer.get();
            } else
                buffer = nullptr;
        }
#endif

这段代码，data为空了，所以直接干掉……(请原谅我的任性)

嘻哈小猴

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
webkit对接woff字体

Webkit对接Woff字体最近使用webkit浏览器登录一些网页的时候，发现网页上有好多字体跟我在chrome浏览器或者火狐浏览器上显示都不一样，于是乎深入研究了一下，把页面下载下来，发现某些页面的字体都是自定义的family，然后他们的字库除了ttf格式，还有otf、woff、woff2等。看webkit代码FontCustomPlatformData.cpp
复制链接

扫一扫

专栏目录