如何破解反爬虫手段?这都可以

释放双眼,带上耳机,听听看~!

SVG 态射反食腐SVG 是用于叙述三维向量绘图的一种绘图文件格式它如前所述 XML 叙述绘图,对绘图展开弱化或增大操作都不能负面影响绘图产品质量向量绘图的那个特点使得它被应用在 Web 中文网站中接下去他们要了解的反食腐方式

正是利用 SVG 实现的,此种反食腐方式用向量绘图替代具体的文本,不能负面影响使用者正常写作,但食腐流程却无法像加载文本那样获得 SVG 绘图中的文本由于 SVG 中的绘图代表者的也是两个个文本,所以在采用时必须在后端或后端将真实世界的文本与相关联的 SVG 绘图展开态射和替代,此种反食腐方式被称为 SVG 态射反食腐。

6.3.1 SVG 态射反食腐绕开两栖作战实例 6:SVG 态射反食腐实例邮箱:www.porters.vip/confusion/f…任务:banlist甜品店家赞扬中文网站网页中的店家联系方式号码、店面门牌号和打分统计数据,网页文本如图 6-15。

所示。

如何破解反爬虫手段?这都可以

图 6-15 实例 6 网页在撰写 Python 标识符之前,他们需要确定目标统计数据的原素功能定位在功能定位过程中,辨认出两个与过往相同的现象:很多位数在 HTML 标识符中并不存在例如菜色的打分统计数据,其原素功能定位如图 6-16 所示。

如何破解反爬虫手段?这都可以

图 6-16 打分统计数据中菜色平均分原素功能定位依照网页表明文本,HTML 标识符中应该是 8.7 才对,但实际上他们看到的看似:菜色:.7 拷贝标识符HTML 标识符位数 7 和小数,但没 8 那个位数,似乎位数 8 的边线被 d 条码占有。

而店家号码号码处的表明就更怪异了,两个位数都没店家号码相关联的 HTML 标识符如下表所示:号码:-拷贝标识符包涵很多的 d 条码,何况它采用 d 条码展开转义,然后用原素展开全面覆盖吗?他们能将 d 条码的数目和位数的数目展开对照,辨认出它们的数目是完全相同的,换句话说两对 d 条码代表者两个位数。

每两对 d 条码都有 class 特性,很多 class 特性值是完全相同的,很多则相同。他们再将 class 特性值与位数展开对照,看看若想找出规律性,如图 6-17 所示。

如何破解反爬虫手段?这都可以

图 6-17 class 特性值和位数的对照从图 6-17 中能窥见,class 特性值和位数是一一相关联的,如特性值 vhk08k 与位数 0 相关联依照那个蛛丝马迹,他们能揣测每一位数都与两个特性值相关联,相关联关系如图 6-18 所示。

如何破解反爬虫手段?这都可以

图 6-18 位数与特性值相关联关系浏览器在渲染网页的时候就会按照那个相关联关系展开态射,所以网页中表明的是位数,而他们在 HTML 标识符中看到的则是这些 class 特性值浏览器在渲染时将 HTML 中的 d 条码与位数按照此关系展开态射,并将态射结果呈现在网页中。

态射逻辑如图 6-19 所示

如何破解反爬虫手段?这都可以

图 6-19 态射逻辑他们的食腐标识符能按照同样的逻辑实现态射功能,在解析 HTML 标识符时将 d 条码的 class 特性值取出来,然后展开态射即可得到网页中表明的位数如何在食腐标识符中实现态射关系呢?实际上网页中采用的是“特性名位数”此种结构,Python 中内置的字典正好能满足他们的需求。

他们能用 Python 标识符测试一下,标识符如下表所示:# 定义态射关系 mappings = {vhk08k: 0, vhk6zl: 1, vhk9or: 2,     vhkfln: 3, vhkbvu: 4, vhk84t: 5,     vhkvxd: 6, vhkqsc: 7, vhkjj4: 8,     vhk0f1: 9}  # HTML 中得到的特性值 html_d_class = vhkvxd  # 将态射后的结果打印输出 print(mappings.get(html_d_class)) 拷贝标识符

这段标识符的逻辑是:首先定义特性值与位数的态射关系,然后假设两个 HTML 中 d 条码的特性值,接着将那个特性值的态射结果打印出来标识符运行后得到的结果为:6 拷贝标识符运行结果说明态射此种方法是可行的接着他们试一试将店家的联系方式号码态射出来:。

# 定义态射关系 mappings = {vhk08k: 0, vhk6zl: 1, vhk9or: 2,              vhkfln: 3, vhkbvu: 4, vhk84t: 5,              vhkvxd: 6, vhkqsc: 7, vhkjj4: 8,              vhk0f1: 9}  # 店家联系方式号码 class 特性 html_d_class = [vhkbvu, vhk08k, vhk08k,                  , vhk84t, vhk6zl,                  vhkqsc, vhkqsc, vhk6zl]      phone = [mappings.get(i) for i in html_d_class]  # 将态射后的结果打印输出 print(phone) 拷贝标识符

运行结果为:[4, 0, 0, None, 5, 1, 7, 7, 1] 拷贝标识符他们采用态射的方法得到了店家联系方式号码,说明 SVG 态射反食腐已经被他们绕开了6.3.2 大众点评反食腐案例此种态射方式不仅仅出现在本书的实例中,在大型中文网站中也有应用。

大众点评是中国领先的本地生活信息及交易平台,也是全球最早建立的独立第三方消费点评中文网站大众点评不仅为使用者提供商户信息、消费点评及消费优惠等信息服务,同时提供团购、餐厅预订、外卖和电子会员卡等 O2O(Online To Offline)交易服务。

大众点评中文网站也采用了态射型反食腐方式,打开浏览器并访问 www.dianping.com/shop/147410… 6-20 所示。

如何破解反爬虫手段?这都可以

图 6-20 大众点评店家信息页大众点评的店家信息页主要用于展示消费者对店家的各项打分、店家号码、店面门牌号和推荐菜品等。他们能看看店家号码或打分的 HTML 标识符,如图 6-21 所示。

如何破解反爬虫手段?这都可以

图 6-21 店家号码 HTML 标识符大众点评中的店家号码并不是全部采用 d 条码替代,其部分采用了位数但是仔细观察一下就能辨认出店家号码的数目等于 d 条码数目加上位数的数目,说明 d 条码的 class 特性值与位数也有可能是一一相关联的态射关系。

感兴趣的同学能采用实例 6 中的方法,尝试态射大众点评案例中的位数如果此种方式的绕开方法这么简单的话,那么它早就被淘汰了,为什么连大众点评这样的大型中文网站都会采用呢?他们继续往下看,大众点评的店家营业时间部分的 HTML 标识符如图 6-22 所示。

如何破解反爬虫手段?这都可以

图 6-22 大众点评店家营业时间除了刚才的位数态射之外,大众点评还对中文展开了态射此时如果按照实例 6 中人为地将 class 值和相关联的文本展开态射的话,就非常麻烦了试想一下,如果网页中所有的文本都采用此种态射反食腐的方式,那么食腐工程师要如何应对呢?对所有用到的文本展开态射吗?。

这不可能做到,其中要完成态射的包括 10 个位数、26 个英文本母和几千个常用汉字而且目标中文网站一旦更改文本的相关联关系,那么食腐工程师就需要重新态射所有文本面对这样的问题,他们必须找出文本态射规律性,并且能够采用 Python 语言实现态射算法。

如此一来,无论目标中文网站文本态射的相关联关系如何变化,他们都能够采用这套态射算法得到正确的结果此种态射关系在网页中是如何实现的呢?是采用 JavaScript 在网页中定义数组吗?还是异步请求API 拿到 JSON 统计数据?这都有可能,接下去他们就去寻找答案。

6.3.3 SVG 反食腐原理态射关系不可能凭空出现,一定采用了某种技术特性HTML 中与条码 class 特性相关的只有 JavaScript 和 CSS依照那个蛛丝马迹,他们需要继续对实例 6 展开分析。

案例中店家号码的 HTML 标识符为:号码:-拷贝标识符他们能随意选择两对 d 条码,然后观察它相关联的 CSS 样式有没能深入分析的蛛丝马迹,如果没蛛丝马迹再看 JavaScript d 条码的 CSS 样式如下表所示:。

d[class^=vhk] {     width: 14px;     height: 30px;     margin-top: -9px;     background-image: url(../font/food.svg);     background-repeat: no-repeat;     display: inline-block;     vertical-align: middle;     margin-left: -6px;  }  .vhkqsc {    background: -288.0px -141.0px;  } 拷贝标识符

d 条码样式看上去没什么特别之处,只是设置了 background 特性的坐标值但是上方 d 条码的公共样式中设置了背景图片,他们能拷贝背景图片的门牌号,在浏览器的新条码页中打开,d 条码背景图如图 6-23 所示。

如何破解反爬虫手段?这都可以

图 6-23  条码背景图d 条码的背景图中全部都是位数,这些无序的位数共有 4 行。但这好像不是一张大图片,他们查看该图片网页的源标识符,文本如图 6-24 所示。

如何破解反爬虫手段?这都可以

图 6-24 图片网页源标识符源标识符中前两行表明这是两个 SVG 文件,该文件中采用 text 条码定义文本, style 条码用于设置文本样式, text 条码定义的文本正是图片网页表明的位数何况这些无序的位数就是他们在网页中看到的号码号码和打分位数?。

除了 class 特性值为 vhkbvu 的 d 条码,其他条码也采用了那个的 CSS 样式,但每对 d 条码的坐标功能定位都相同它们的坐标功能定位如下表所示:.vhkbvu {    background: -386px -97px;  }  .vhk08k {    background: -274px -141px;  }  .vhk84t {   background: -176px -141px;  } 拷贝标识符。

坐标是功能定位位数的关键,要想知道坐标的计算方法,必须了解一些关于 SVG 的知识在本节开始的时候,他们简单地了解了 SVG 的概念,知道 SVG 是如前所述 XML 的实际上它是用文本文件格式的叙述性语言来叙述图像文本的,因此 SVG 是一种与图像分辨率无关的向量绘图文件格式。

打开文本编辑器,并在新建的文件中写入以下文本:hello,world拷贝标识符将该文件保存为 test.svg,然后采用浏览器打开 test.svg 文件,表明文本如图 6-25 所示。

如何破解反爬虫手段?这都可以

图 6-25 test.svg 表明文本标识符前 3 行声明文件类型,第 4 行~第 5 行定义了 SVG 文本块和画布宽高,第 6 行采用 text 条码定义了一段文本并指定了文本的坐标这段文本就是他们在浏览器中看到的文本,而标识符中的 。

x 坐标和 y 坐标则用于确定该文本在画布中的边线,坐标规则如下表所示以网页的左上角为零坐标点,即坐标值为 (0, 0)坐标以像素为单位x 轴的正方向为从左到右,y 轴的正方向是从上到下n 个字符能有 n 个边线参数。

如果字符数目大于边线参数数目,那么没边线参数的字符将以最后两个边线参数为零坐标点,并按原文顺序排列看上去并不是很好理解,他们能通过修改标识符来理解坐标轴的定义首先是 x 轴, text 条码中的 x 代表者列表字符在网页中的

x 轴边线,test.svg 中的 x 值为 10,现在他们将其设为 0 ,保存后刷新网页,网页文本如图 6-26 所示。

如何破解反爬虫手段?这都可以

图 6-26 x 为 0 时的 test.svg 表明文本x 的值为 0 时,文本紧贴浏览器左侧而 x 的值为 10 时,文本距离浏览器左侧有一定的距离,这说明 x 的值能够决定文本所在的边线现在他们将标识符中 。

x 相关联的值改为“10 50 30 40 20 60”(注意这里特意将第 2个位数 20与第 5个位数互换了边线),这样做是为了设定前 6个字符的坐标边线此时,第 1 个字符的边线参数为 10,第 2 个字符的边线参数为 50,第 3 个字符的边线参数为 30,以此类推,网页中正常表明的文本顺序应该是:。

holle,world 拷贝标识符但是由于他们调换了第 2 个字符和第 5 个字符的边线参数,即字母 e 和字母 o 的边线互换,如图 6-27所示。

如何破解反爬虫手段?这都可以

图 6-27 设定多个 x 值的 svg图 6-27 中文本顺序与他们揣测的顺序是一样的,这说明 SVG 中每一字符都能有自己的 x 轴坐标值y 与 x 同理,每一字符都能有自己的 y 轴坐标值虽然他们只设定了 6 个边线参数, svg 中的字符却有 11 个,但没设功能定边线参数的字符依然能够按照原文顺序排序。

在了解 SVG 基本知识之后,他们回头看一下案例中所采用的 SVG 文件中坐标参数的设定,图 6-23 中的字符与图 6-24 图片页源标识符中的字符一一相关联,且每一字符都设定了 x 轴的边线参数,而 y

轴则只有 1 个值在了解边线参数之后,他们还需要弄清楚字符功能定位的问题浏览器依照 CSS 样式中设定的坐标和原素宽高来确定 SVG 中相关联位数x 轴的正方向为从左到右,y 轴的正方向是从上到下,如图 6-28 所示。

如何破解反爬虫手段?这都可以

图 6-28 SVG x 轴和 y 轴与边线参数的关系而 CSS 样式中的 x 轴与 y 轴是相反的,换句话说 CSS 样式中 x 轴是负数向右的,y 轴是负数向下的,如图 6-29 所示。

如何破解反爬虫手段?这都可以

图 6-29 CSS x 轴和 y 轴与边线参数的关系所以当他们需要在 CSS 中功能定位 SVG 中的字符边线时,需要用负数表示他们能通过两个例子来理解它们的关系,现在需要在 CSS 中功能定位图 6-30 中第 1 行的第 1 个字符的中心点。

如何破解反爬虫手段?这都可以

图 6-30 SVG假设字符大小为 14 px,那么 SVG 的计算规则如下表所示字符在x轴中心点的计算规则为:字符大小除以2,再加字符的x轴起点边线参数,即14÷2+0 等于 7字符在 y 轴中心点的计算规则为:。

y 轴高度减字符 y 轴起点减字符大小,其值除以 2 后加上字符 y 轴起点边线参数,最后再加上字符大小数值的一半,即(38−0−14)÷2+0+7 等于 19最后得到 SVG 的坐标为:x=7 y=19 拷贝标识符。

CSS 样式的 x 轴和 y 轴与 SVG 是相反的,所以 CSS 样式中对该字符的功能定位为:-7px -19px 拷贝标识符这样就能够功能定位到指定字符的中心点了但是如果要在 HTML 网页中完整表明该字符,那么还需要为 HTML 中相关联的条码设置宽高样式,如:。

width: 14px;  height: 30px; 拷贝标识符在了解了 SVG 与 CSS 样式的关联关系后,他们就能够依照 CSS 样式态射出 SVG 中相关联的字符在实际场景中,他们需要让流程能够自动处理 CSS 样式和 SVG 的态射关系,而不是人为地完成这些。

工作以实例 6 中的 SVG 和 CSS 样式为例,假如他们需要用 Python 标识符实现自动态射功能,首先他们就需要拿到这两个文件的 URL,如:url_css = http://www.porters.vip/confusion/css/food.css  url_svg = http://www.porters.vip/confusion/font/food.svg 拷贝标识符。

还有需要态射的 HTML 条码的 class 特性值,如:css_class_name = vhkbvu 拷贝标识符接下去采用 Requests 库向 URL 发出请求,拿到文本文本相关联标识符如下表所示:import requests  css_resp = requests.get(url_css).text  svg_resp = requests.get(url_svg).text 拷贝标识符。

提取 CSS 样式文件中条码特性相关联的坐标值,这里采用正则展开匹配即可相关联标识符如下表所示:import re  pile = .%s{background:-(\d+)px-(\d+)px;} % css_class_name  pattern = re.compile(pile)  css = css_resp.replace(\n, ).replace( , )  coord = pattern.findall(css)  if coord:   x, y = coord[0]   x, y = int(x), int(y) 拷贝标识符。

此时得到的坐标值是正数,能直接用于 SVG 字符功能定位功能定位前他们要先拿到 SVG 中所有 text 条码的 Element 对象:from parsel import Selector  svg_data = Selector(svg_resp)  texts = svg_data.xpath(//text) 拷贝标识符。

然后获取所有 text 条码中的 y 值,接着他们将上一步得到的 Element 对象展开循环取值即可:axis_y = [i.attrib.get(y) for i in texts if y <= int(i.attrib.get(y))][0] 拷贝标识符

得到 y 值后就能开始字符功能定位了要注意的是,SVG 中 text 条码的 y 值与 CSS 样式中得到的 y 值并不需要完全相等,因为样式能随意调整,比如 CSS 样式中-90 和-92 对于 SVG 的功能定位来说并没什么差别,所以他们只需要知道具体是哪两个 text 即可。

那么如何确定是哪两个 text呢?他们能用排除法来确定,假如当前 CSS 样式中的 y 值是-97,那么在 SVG 中 text 的 y 值就不可能小于 97,他们只需要取到比 97 大且最相近的 text 条码

y 值即可比如当前 SVG 所有 text 条码的 y 值为:[38, 83, 120, 164] 拷贝标识符那么大于 97 且最相近的是 120将那个逻辑转化为标识符:axis_y = [i.attrib.get(y) for i in texts if y <= int(i.attrib.get(y))][0] 拷贝标识符。

得到 y 值后就能确定具体是哪个 text 条码了相关联标识符如下表所示:svg_text = svg_data.xpath(//text[@y=%s]/text() % axis_y).extract_first() 拷贝标识符。

接下去需要确认 SVG 中的文本大小,也就是需要找出 font-size 特性的值相关联标识符如下表所示:font_size = re.search(font-size:(\d+)px, svg_resp).group(1) 拷贝标识符。

得到 font-size 的值后,他们就能功能定位具体的字符了x 轴有多少个字符呢?刚才他们拿到的svg_text 就是指定的 text 条码中的字符:671260781104096663000892328440489239185923 拷贝标识符。

他们需要计算字符串长度吗?并不用,他们知道,每一字符大小为 14 px,只需要将 CSS 样式中的 x 值除以字符大小,得到的就是该字符在字符串中的边线除法得到的结果有可能是整数也有可能是非整数,当结果是整数是说明功能定位完全准确,他们利用切片特性就能拿到字符。

如果结果是非整数,就说明功能定位不完全准确,由于字符不可能出现一半,所以他们利用地板除(编程语言中常见的向下取整除法,返回商的整数部分)就能拿到整数:position = x // int(font_size) # 结果为 27 拷贝标识符

换句话说 CSS 样式 vhkbvu 态射的是 SVG 中第 4 行文本的第 27 个边线的值。态射结果如图 6-31 所示。

如何破解反爬虫手段?这都可以

图 6-31 态射结果然后再利用切片特性拿到字符相关联标识符如下表所示:number = svg_text[position]  print(number) 拷贝标识符标识符运行结果为 4他们还能尝试其他的 class 特性值,最后得到的结果与网页表明的字符都是完全相同的,说明此种态射算法是正确的。

至此,他们已经完成了对态射型反食腐的绕开6.3.4 小结与 6.1 节和 6.2 节完全相同,本节实例所用的反食腐方式,即使借助渲染工具也无法获得“见到”的文本SVG 态射反食腐利用了浏览器与编程语言在渲染方面的差异,以及 SVG 与 CSS 功能定位这样的后端知识。

如果食腐工程师不熟悉渲染原理和后端知识,那么此种反食腐方式就会带来很大的困扰

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。e网宇宙

给TA打赏
共{{data.count}}人
人已打赏
热点

黑洞照片原图首次曝光!这次你能看得清吗?燃爆了

2023-6-14 10:22:16

热点

三维全息成像是什么?难以置信

2023-6-14 10:24:35

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索