GlidedSKY挑战之十:雪碧图1

挑战网址:http://glidedsky.com/level/crawler-sprite-image-1

题目介绍

HTTP是基于TCP连接的，TCP连接的建立是需要时间和资源的。而下载网页所需的图片资源是通过HTTP的。如果有非常多的小图片，就需要建立很多TCP连接。勤劳勇敢的前端工作者们，想到把所有小图片放到一张图片里面去。这样就可以通过一次TCP链接，下载所有的小图片，再通过前端的奇技淫巧，来展示正确的图片。
这种由很多小图片组成的图片，被称为雪碧图。雪碧图可以节约TCP连接的同时，也为爬取带来了难度。这里有一个网站，分了1000页，求所有数字的和。

挑战难度:★★★★★★★☆☆☆
看完题目介绍，很好，看起来很简单嘛

• （脑力：先这样这样，在那样那样，应该就解决了，卧槽，我好聪明。）
• (眼睛：兴奋的冒金星)
• （手 ：办不到！）
  我想这次题主发善心了？突然眼睛一瞥"奇技淫巧"，发现事情应该没有那么简单。
  果然不出我所料，打开原网页，发现标签里面啥也没有网页上却显示了数字，而每一个标签里面都有两个类属性，心想问题应该是是在类标签的css样式里面了（这他么不是废话吗）。
  话不多说，先将全部的网页下下来，为啥这么做呢？
• 以后自己写网页可以参考（心里想着是参考，其实就是直接贴上去）
• 这个网站比较便宜，是不是崩溃，先把源码拿到手在本地可以随时处理
• 如果最终的结果不对，对比几个网页就可以找到规律，并迅速找出出问题的数据
  

任意打开一个源代码开始分析:

• 每一个标签中都有一个sprite类
  - 查看这个属性
  可以看出这是一张base64的图，用base64.b64decode将字符串解析成图片发现是一张0-9的数字图，通过处理几页，发现都是0-1的数字，区别就是图片的大小和数字的放大缩小程度不一样而已。
  
• 再看看另外一个类属性，发现是定位属性。
  到这里基本上知道怎么做了。
  
• 先将图片拿到再将图片总宽度求出来除以10得到每个字符的平均大小以及范围，然后根据类属性进行匹配即可得到网页上看到的数字。

 		imgdata=base64.b64decode(tagString)  
        file=open(str(x) + '.jpg','wb')
        file.write(imgdata)  
        file.close()  
        im = Image.open(str(x) + '.jpg')
        imX,imY = im.size
        avg = imX/10
        # print(avg)
        xiabiao = dict(zip([x for x in range(0,10,1)],[avg/2 + x * avg for x in range(0,10,1)]))
        # print(xiabiao)

• 中间出现结果错误的情况，主要是有两次的得到的数据不太一样，经过调整最终得到了结果。

搞定离场

喜欢折腾代码的加群（群号:822286811）一起交流学习【python、VBA、Shell、Linux、dos、爬虫、拆机、装系统技术交流群】，点击链接加入群聊【计算机技术交流】：https://jq.qq.com/?_wv=1027&k=5V7RB2c