webkit对接woff字体

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 woffif(fontIsWOFF) {Vector<char> sfnt;if(convertWOFFToSfnt(buffer, sfnt)) {sfntBuffer = SharedBuffer::adoptVector(sfnt);buffer = sfntBuffer.get();} elsebuffer = nullptr;}
#endif

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

webkit对接woff字体相关推荐

html加css绘制oprea的logo,css – 在Opera和webkit中自定义字体的底部
虽然这不是我正在寻找的解决方案,但我已经找到了可能适用于其他解决方案的解决方案: 在我的原始样式表中,我已经指定了如下的字体: @font-face { font-family: 'DroidSans ...
WOFF字体的Mime类型？
什么mime类型应该作为WOFF字体? 我将truetype(ttf)字体作为font/truetype和opentype(otf)作为font/opentype opentype提供,但我找不到WO ...
猫眼电影爬取(woff 字体文件解析)
猫眼电影网站,中电影评分在网页显示正常但是检查网页源码会发现,评分所在位置是一串迷之字符串根本认不出,原因是使用了自定义字体代码 <span class="stonefont" ...
woff字体图元结构剖析，自定义字体的制作与匹配和识别
前面我在<2万字硬核剖析网页自定义字体解析>一文中,讲解了通过图像识别来解析自定义字体,但是图像识别的缺点在于准确率并不能达到100%,还需要二次修改. 前面将字体的称为点阵图,其实根据T ...
woff字体反爬实战，10分钟就能学会(ttf字体同理)
声明:本帖子仅是用于学习用途,请勿与用于恶意破坏别人网站,本人不承担法律责任. 来继续学爬虫呀! 很开心,竟然上榜某爬虫练习网站了!!! 来看一下榜单超激动的!!但是还有两道目前个人解决不了,希望哪 ...
vue+python把woff字体文件中的字体全部读取出来
获取woff字体文件的字符编码 from fontTools.ttLib import TTFontfont = TTFont("7ef51293.woff") extraName ...
爬虫woff字体反爬破解
好久没写爬虫了,最近发现很多网站都出现了woff字体反爬.百度找了一下,发现都要钱,只好默默说一声fuck 那么,只好自己破解了.好的,那么开始. 如果你在抓去某个网站时候,抓下来的文字读不通,打开n ...
WOFF字体反爬之易车网
相关权益问题,联系邮箱即可删除:lh1995cn@gmail.com 前言易车网链接:http://dianping.bitauto.com/sid_2384/koubei/255792764194 ...
CSS3新特性详解(二)：CSS3 字体@font-face详解、如何创建和修改woff字体文件及text-shadow等文本效果
关于CSS3新特性,在上篇博文中"CSS3新特性详解(一):CSS3选择器.边框.背景使用细节及案例演示",讨论了CSS3选择器.边框和背景,本文讨论字体@font-face使 ...

webkit对接woff字体

webkit对接woff字体相关推荐

最新文章

热门文章