2019年末逆向复习系列之从猫眼字体反爬分析谈谈字体反爬的前世今生

郑重声明：本项目的所有代码和相关文章，仅用于经验技术交流分享，禁止将相关技术应用到不正当途径，因为滥用技术产生的风险与本人无关。

这篇文章是公众号《云爬虫技术研究笔记》的《2019年末逆向复习系列》的第六篇：《从猫眼字体反爬分析谈谈字体反爬的前世今生》

本次案例的代码都已上传到Review_Reverse上面，后面会持续更新，大家可以Fork一波。

背景分析

“字体反爬”我相信大多数从事爬虫工作的工程师都接触过，这其实不是一种常规的反爬手段，它其实是页面和前端字体文件想配合完成的一个反爬策略。像最早使用字体反爬的58同城、汽车之家到现在很多App的web页面也开始使用，例如美团、猫眼、快手抖音等等。随着爬虫工程师和反爬工程师的不断对抗，字体反爬从一开始的单纯依靠一个写死的字体文件升级成现在最新动态的字体文件，而字体反爬的攻克也有一个开始的解析字体文件做数据映射到现在依靠KNN来做动态映射，算是经历了一个又一个光辉的“升级阶段”，这篇文章就是简单讲述一下字体反爬的演变史以及最新依靠KNN来做动态映射的破解思路。

历史分析

PS: 关于历史分析的项目都可以在Review_Reverse项目下的fonts目录看到使用方法：python -m fonts.xxxx即可

首先我们先理解字体反爬的原理，就是前端工程师通过自定义的字体来替换页面中某些关键的数据，那在HTML中如何使用自定义字体呢？答案就是使用@font-face，我们举个例子看看@font-face

@font-face {
 font-family: <identifier>; 
 src: <fontsrc> [, <fontsrc>]*; <font>;
  }

里面的font-family也就是一个特定的名字，src就表示你需要引用的具体的文件，而这个文件就是字体文件，一般是ttf类型，eot类型，当然，现在因为ttf文件过大，在移动端使用的时候会导致加载速度过慢，woff类型的文件最近也广泛会用，所以一般大家现在碰到的都是woff类型的文件。那woff文件中的内容是什么呢？它是怎样把数据进行替换的呢？下面我们先简单的看个例子。我们先把woff文件打开，需要使用两种工具打开：

FontCreator工具：www.high-logic.com/font-editor…
在线FontEditor工具：fontstore.baidu.com/static/edit…

这里我们使用FontCreator，我们把FontCreator下载下来，传来一个我们之前准备好的woff文件看看效果

我们可以看到woff文件中每个字符都有一个编码对应，woff实际上就是编码和字符的映射表。我们再来看看页面中的被替换的词是什么形式

我们对比下可以发现，页面源码中的被替换字的就是woff文件中字符的编码加上$#x，所以大家可以发现字体替换的原理就是这样，我们使用一个简单的等式来表现

“替换数据”=“$#x{woff文件中被替换数据的编码}”

现在我们懂得了原理，下面开始回顾下字体反爬的演变历程

1. 阶段一：通过固定的字体文件进行数据替换

反爬方：一开始的时候，字体反爬还没有发展的很成熟，所以大部分网站使用字体反爬的方式是使用固定的字体文件来做数据替换，固定的字体文件就表明每个数据的编码是写死的，不变的，那么每次网站引用这个woff文件之后，都可以用相同的编码来替换想要替换的数据，这就是最初的时候的字体反爬。应对方：既然他们的字体文件不变，那我们就直接解析他们的固定的woff文件就行，我们使用Python的fontTool库的ttLib包，代码如下：

from pathlib import Path
from fontTools.ttLib import TTFont
woff_path = Path(__file__).absolute().parent/"base64 (1).woff"
font = TTFont(woff_path)
font_names = font.getGlyphOrder()
font_str = [
    "8", "验", "杨", "女", "3", "届", "7", "男", "高", "赵", "6", "2", "下", "以", "技", "黄", "周", 
    "4", "经", "专", "硕", "刘", "吴", "陈", "士", "E", "5", "中", "博", "1", "科", "大", "9", "本",
     "王", "B", "无", "李", "应", "生", "校", "A", "0", "张","M"
]
print(dict(zip(font_names[2:],font_str)))

我们解析woff文件得到一定顺序的编码集再结合在FontCreator中的字符集得到字符编码字典，在我们解析HTML源码的时候替换就行了。

{'uniE032': '8', 'uniE200': '验', 'uniE267': '杨', 'uniE2DF': '女', 'uniE34E': '3', 'uniE39C': '届', 
'uniE42A': '7', 'uniE481': '男', 'uniE51F': '高', 'uniE555': '赵
', 'uniE595': '6', 'uniE608': '2', 'uniE6CD': '下', 'uniE72D': '以', 'uniE7C1': '技', 'uniE7C6': '黄', 
'uniE7D3': '周', 'uniE841': '4', 'uniE84B': '经', 'uniE8A4': '专', 'uniE8E6': '硕', 'uniE8F4': '刘', 
'uniE906': '吴', 'uniE9CF': '陈', 'uniEA8F': '士', 'uniEB2C': 'E', 'uniEBBA': '5', 'uniEBE2': '中', 'uniED0E': '博',
 'uniEF3E': '1', 'uniF003': '科', 'uniF012': '大', 'uniF01A': '9', 'uniF02F': '本', 
'uniF0D7': '王', 'uniF160': 'B', 'uniF180': '无', 'uniF205': '李', 'uniF2A0': '应', 'uniF3B5': '生', 'uniF501': '校',
 'uniF6E9': 'A', 'uniF71C': '0', 'uniF76F': '张', 'uniF877': 'M'}

2. 阶段二：字体信息不换，动态更换字符编码

反爬方：既然写死的woff文件太容易让人解析，那就每次都更换新的woff文件，woff文件不更换字体信息，只更换字符编码，这样，每次的字符编码都不一样，解析的时候就不能使用同一套字符编码字典去解析了。应对方：每次同一字符的编码都不一样的情况是什么样呢？可以看看下面两个图所示

我们连续两次请求的同一个字符却有不同的编码，换个思路，同一个的字符它们的字体的关键点的坐标是不变的，就像我们在FontCreator点开某个字符看的的一样

为了得到每个字的坐标点参数，我们需要把woff文件转换成xml文件

from pathlib import Path
from fontTools.ttLib import TTFont
font1_path = Path(__file__).absolute().parent/"font_1.xml"
font2_path = Path(__file__).absolute().parent/"font_2.xml"
woff1_path = Path(__file__).absolute().parent/"base64 (1).woff"
woff2_path = Path(__file__).absolute().parent/"base64 (2).woff"
font_1 = TTFont(woff1_path)
font_2 = TTFont(woff2_path)
font_1.saveXML(font1_path)
font_2.saveXML(font2_path)

得到文件是这样的

我们根据刚才生字的两个不同编码寻找，得到下面这两个结构

我们可以看到，虽然这两个字符的坐标不一样，但是从旧字符根据一定的偏移量可以得到新字符，所以我们破解这一代字体反爬的手段可以是把最先的字符和字符的坐标保留下来，之后请求得到的字符和字符坐标，根据一定量的偏移去匹配是否是同一个字，类似这样

from pathlib import Path
from fontTools.ttLib import TTFont
woff1_path = Path(__file__).absolute().parent/"base64 (1).woff"
woff2_path = Path(__file__).absolute().parent/"base64 (2).woff"
font_1 = TTFont(woff1_path)
font_2 = TTFont(woff2_path)
font_old_order = font_1.getGlyphOrder()[2:]
font_new_order = font_2.getGlyphOrder()[2:]


def get_font_flags(font_glyphorder, font_ttf):
    f = {}
    for i in font_glyphorder:
        flags = font_ttf['glyf'][i]
        if "flags" in flags.__dict__:
            f[tuple(list(flags.flags))] = i
    return f


def comp(arr1, arr2):
    if len(arr1) != len(arr2):
        return 0
    for i in range(len(arr2)):
        if arr1[i] != arr2[i]:
            return 0
    return 1


def get_old_new_mapping():
    old, new = get_font_flags(font_glyphorder=font_old_order, font_ttf=font_1), get_font_flags(
        font_glyphorder=font_new_order, font_ttf=font_2)
    result_dict = {}
    for key1, value1 in old.items():
        for key2, value2 in new.items():
            if comp(key1, key2):
                result_dict[value1] = value2
    return result_dict


print(get_old_new_mapping())

我们会得到新旧两个字符的映射

{'uniE032': 'uniF889', 'uniE595': 'uniEB52', 'uniF01A': 'uniF07A', 'uniF71C': 'uniEBDE'}

3. 阶段三：有了动态的编码，再搞个动态字体坐标？

反爬方：动态更换字符编码集也能根据字体坐标来破解，要是新旧两个字符的坐标不是按照一定的偏移量来做的呢？例如我们新的字符和旧的字符的字体不一样，新的字体做了一定量的变形，导致某些坐标的缺少以及坐标的偏移量不一致，所以可以做几百套不同字体坐标，不同字符编码的动态字体集（真的变态！）。应对方：这一阶段的反爬看到过很多大佬的实现：

有使用阈值来做的，不过阈值是写死的，也就是说明成功其实有点靠运气，有时候返回的两个字符坐标差值在阈值内，有时不在，所以这一个方案有点不太靠谱。
有使用ocr来做的，哈哈，真的是秀，利用ocr来做的原理就是先利用坐标勾勒出汉字图样，接着识别出汉字，再把相同汉字的不同编码做对应，这样也能得出结果，效果没有具体去测算，不过使用ocr来识别汉字应该相对于tf，pytorch等来说效果会差点。
之前看到大壮哥使用KNN来做，是个好想法，而且也不用去识别图片成汉字，资源消耗和速率上相对来说会小点，原理就是如果一个样本在特征空间中的k个最相邻的样本中的大多数属于某一个类别，则该样本也属于这个类别，并具有这个类别上样本的特性。放在字体这个例子中，就是新字体文件中哪个字符离旧字体文件中的某个字符距离较近，它就属于这个字符的类别，也就是和这个字符是一样的。

4. 阶段四：展望未来。。。

目前还没有新的字体反爬的手段出现，更多的@font-face的加密上面，比如对字体文件的地址做基本的Js加密等等什么的，其他的我就暂时没发现，有发现的大佬可以透露一下。

整个字体反爬的演变历程就是上面介绍的这样，下面我们开始做实战分析。

猫眼实战分析

猫眼国内票房榜地址

maoyan.com/board/1

猫眼字体反爬分析

首先我们进入页面

我们可以看到票房数据被替换了，是被stonefont这个@font-face的名称给替换了，我们去搜索这个stonefont

我们通过这个woff地址去下载woff文件，在利用FontCreator打开，看到这样

和我们之前看到的字体反爬方式是一样的，动态字体文件，以及动态的字体坐标，接下来，我们用KNN的思路去破解它。

猫眼字体KNN思路分析

KNN算法比较简单，我们划分测试集和训练集，先用测试集得到每个数字的距离，然后在测试的时候我们对不同的输入（也就是数字）就是距离计算，距离最近的即为相同值。

代码实战

PS: 关于历史分析的项目都可以在Review_Reverse项目下的maoyan目录看到使用方法：python -m maoyan.xxxx即可

我们这次使用Sklearn来做KNN

1. 收集猫眼的多套字体文件

这里我会获取10套字体文件(越多越好)，然后将所有字符对应的字形坐标信息保存到一个列表当中(注意做好字符与字形坐标的对应关系)

def get_font_content() -> str:
    response = requests.get(
        url=_brand_url,
        headers=_headers
    )
    woff_url = re.findall(r"url\('(.*?\.woff)'\)", response.text)[0]
    font_url = f"http:{woff_url}"
    return requests.get(font_url).content


def save_font() -> None:
    for i in range(5):
        font_content = get_font_content()
        with open(f'./fonts/{i+1}.woff', 'wb') as f:
            f.write(font_content)


def get_coor_info(font, cli):
    glyf_order = font.getGlyphOrder()[2:]
    info = list()
    for i, g in enumerate(glyf_order):
        coors = font['glyf'][g].coordinates
        coors = [_ for c in coors for _ in c]
        coors.insert(0, cli[i])
        info.append(coors)
    return info

把FontCreator的字符补充上

def get_font_data() -> List[List[List[int]]]:
    font_1 = TTFont('./fonts/1.woff')
    cli_1 = [6, 7, 4, 9, 1, 2, 5, 0, 3, 8]
    coor_info_1 = get_coor_info(font_1, cli_1)

    font_2 = TTFont('./fonts/2.woff')
    cli_2 = [1, 3, 2, 7, 6, 8, 9, 0, 4, 5]
    coor_info_2 = get_coor_info(font_2, cli_2)

    font_3 = TTFont('./fonts/3.woff')
    cli_3 = [5, 8, 3, 0, 6, 7, 9, 1, 2, 4]
    coor_info_3 = get_coor_info(font_3, cli_3)

    font_4 = TTFont('./fonts/4.woff')
    cli_4 = [9, 3, 4, 8, 7, 5, 2, 1, 6, 0]
    coor_info_4 = get_coor_info(font_4, cli_4)

    font_5 = TTFont('./fonts/5.woff')
    cli_5 = [1, 5, 8, 0, 7, 9, 6, 3, 2, 4]
    coor_info_5 = get_coor_info(font_5, cli_5)

    infos = coor_info_1 + coor_info_2 + coor_info_3 + coor_info_4 + coor_info_5
    return infos

2. 使用knn算法训练数据

通常情况下，拿到样本数据，先进行缺失值处理，然后取出特征值和目标值，再对样本数据进行分割，分为训练集和测试集，然后再对样本数据进行标准化处理，最后进行训练预测。由于采集的字体数据不多，如果按随机分割的方式，训练集容易缺失某些字符，导致预测测试集的结果误差率较大，所以在此固定前40个样本为训练集，最后10个样本为测试集合。另外，多次测试发现，此处进行标准化，会影响成功率，所以不采用，另外k值取1, 也就是说，我判定当前样本跟离它最近的那个样本属于同一类型，即同一个字符，这个值取多少合适经过调试才知道，最后预测10个样本，包含了0-9 10个字符，成功率为100%。

import numpy as np
import pandas as pd
from maoyan.font import get_font_data
from sklearn.impute import SimpleImputer
from sklearn.model_selection import train_test_split
from sklearn.neighbors import KNeighborsClassifier
from sklearn.preprocessing import StandardScaler


def main() -> None:
    # 处理缺失值
    imputer = SimpleImputer(missing_values=np.nan, strategy='mean')
    data = pd.DataFrame(imputer.fit_transform(pd.DataFrame(get_font_data())))
    # 取出特征值\目标值
    x = data.drop([0], axis=1)
    y = data[0]
    # 分割数据集
    # x_train, x_test, y_train, y_test = train_test_split(x, y, test_size=0.2, random_state=0)
    x_train = x.head(30)
    y_train = y.head(30)
    x_test = x.tail(10)
    y_test = y.tail(10)
    # 标准化
    # std = StandardScaler()
    # x_train = std.fit_transform(x_train)
    # x_test = std.transform(x_test)
    # 进行算法流程
    knn = KNeighborsClassifier(n_neighbors=1)
    # 开始训练
    knn.fit(x_train, y_train)
    # 预测结果
    y_predict = knn.predict(x_test)
    print(y)
    # 得出准确率
    print(knn.score(x_test, y_test))

3. 得到训练好的流程之后我们进行测试

def get_board() -> None:
    map_dict = get_map(
        text=requests.get(
            url=_board_url,
            headers=_headers
        ).text
    )
    for uni in map_dict.keys():
        text = text.replace(uni, map_dict[uni])
    html = etree.HTML(text)
    dd_li = html.xpath('//dl[@class="board-wrapper"]/dd')
    for dd in dd_li:
        p_li = dd.xpath(
            './div[@class="board-item-main"]//div[@class="movie-item-info"]/p')
        title = p_li[0].xpath('./a/@title')[0]
        star = p_li[1].xpath('./text()')[0]
        releasetime = p_li[2].xpath('./text()')[0]
        p_li = dd.xpath(
            './div[@class="board-item-main"]//div[@class="movie-item-number boxoffice"]/p')
        realtime_stont = ''.join(
            list(map(lambda x: x.strip(), p_li[0].xpath('.//text()'))))
        total_stont = ''.join(
            list(map(lambda x: x.strip(), p_li[1].xpath('.//text()'))))
        print(title)
        print(star)
        print(releasetime)
        print(realtime_stont)
        print(total_stont)
        print('-' * 50)


get_board()