js破解-学习笔记
具体的数据如下
![](https://ask.qcloudimg.com/http-save/yehe-4543082/oi4rcd6bdy.png?imageView2/2/w/1620)
查看页面源代码发现,一个好玩的事情,源代码中使用了大量的CSS3的语法 下图,我标注的部分就是关键的一些数据了,大概在600行之后。
![](https://ask.qcloudimg.com/http-save/yehe-4543082/h5hldv8atb.png?imageView2/2/w/1620)
反爬措施展示
源文件数据
刹车/<span class='hs_kw86_baikeIl'></span>安全系统
页面显示数据
![](https://ask.qcloudimg.com/http-save/yehe-4543082/f1jg2jx1jn.png?imageView2/2/w/1620)
一些关键数据被处理过了。
爬取关键信息
我们要把源代码中的关键信息先获取到,即使他数据是存在反爬的。获取数据是非常简单的。通过request
模块即可
def get_html(): url = "https://car.autohome.com.cn/config/series/59.html#pvareaid=3454437" headers = { "User-agent": "你的浏览器UA" } with requests.get(url=url, headers=headers, timeout=3) as res: html = res.content.decode("utf-8") return html
找关键因素
在html页面中找到关键点:
- var config
- var levelId
- var keyLink
- var bag
- var color
- var innerColor
- var option
这些内容你找到之后,你下手就用重点了,他们是什么?数据啊,通过简单的正则表达式就可以获取到了
def get_detail(html): config = re.search("var config = (.*?)};", html, re.S) option = re.search("var option = (.*?)};", html, re.S) print(config,option)
输出结果
>python e:/python/demo.py <re.Match object; span=(167291, 233943), match='var config = {"message":"<span class=\'hs_kw50_co> >python e:/python/demo.py <re.Match object; span=(167291, 233943), match='var config = {"message":"<span class=\'hs_kw50_co> <re.Match object; span=(233952, 442342), match='var option = {"message":"<span class=\'hs_kw16_op>
处理汽车参数
通过正则表达式的search方法,匹配数据,然后调用group(0) 即可得到相关的数据
def get_detail(html): config = re.search("var config = (.*?)};", html, re.S) option = re.search("var option = (.*?)};", html, re.S) # 处理汽车参数 car_info = "" if config and option : car_info = car_info + config.group(0) + option.group(0) print(car_info)
拿到数据之后,没有完,这是混淆之后的数据,需要解析回去,继续关注网页源代码,发现一段奇怪的JS。这段JS先不用管,留点印象即可~
![](https://ask.qcloudimg.com/http-save/yehe-4543082/tu4wtooywh.png?imageView2/2/w/1620)
关键字破解
![](https://ask.qcloudimg.com/http-save/yehe-4543082/nc04x2abba.png?imageView2/2/w/1620)
注意到
<span class="hs_kw28_configfH"></span>
hs_kw数字_configfH
是一个span的class
我选中span
之后的::before
![](https://ask.qcloudimg.com/http-save/yehe-4543082/4e7rwm287g.png?imageView2/2/w/1620)
对应的css为
![](https://ask.qcloudimg.com/http-save/yehe-4543082/9yyglo2cpy.png?imageView2/2/w/1620)
发现实测
两个字出现了,对应的class请记住
.hs_kw28_configfH::before
全局搜索一下
![](https://ask.qcloudimg.com/http-save/yehe-4543082/1qwqwr71mn.png?imageView2/2/w/1620)
双击找到来源
![](https://ask.qcloudimg.com/http-save/yehe-4543082/4usfq3bj8n.png?imageView2/2/w/1620)
确定数据就在html源码当中。
格式化html源码,在内部搜索hs_kw
,找到关键函数
![](https://ask.qcloudimg.com/http-save/yehe-4543082/x94az0ca9p.png?imageView2/2/w/1620)
function $GetClassName$($index$) { return '.hs_kw' + $index$ + '_baikeCt'; }
这段JS的来源就是我们刚才保留的那个JS代码段,复制所有的JS源码,到source里面新建一个snippet
,然后我们运行一下。
![](https://ask.qcloudimg.com/http-save/yehe-4543082/dx4lnq20hh.png?imageView2/2/w/1620)
在里面代码最后添加一个断点,ctrl+enter
运行
![](https://ask.qcloudimg.com/http-save/yehe-4543082/qz8ee9w2mp.png?imageView2/2/w/1620)
运行到断点,在右侧就能看到一些参数出现
![](https://ask.qcloudimg.com/http-save/yehe-4543082/1ndy60pz5i.png?imageView2/2/w/1620)
- $ruleDict$:
- $rulePosList$
![](https://ask.qcloudimg.com/http-save/yehe-4543082/a01u608n3z.png?imageView2/2/w/1620)
通过参数去查找,核心的替换方法
![](https://ask.qcloudimg.com/http-save/yehe-4543082/9uujzolrbm.png?imageView2/2/w/1620)
接下来,我们进行替换操作,这部流程需要用到selenium进行替换
核心代码如下,主要的注释,我写在了代码内部,希望能帮助你看懂
def write_html(js_list,car_info): # 运行JS的DOM -- 这部破解是最麻烦的,非常耗时间~参考了互联网上的大神代码 DOM = ("var rules = '2';" "var document = {};" "function getRules(){return rules}" "document.createElement = function() {" " return {" " sheet: {" " insertRule: function(rule, i) {" " if (rules.length == 0) {" " rules = rule;" " } else {" " rules = rules + '#' + rule;" " }" " }" " }" " }" "};" "document.querySelectorAll = function() {" " return {};" "};" "document.head = {};" "document.head.appendChild = function() {};" "var window = {};" "window.decodeURIComponent = decodeURIComponent;") # 把JS文件写入到文件中去 for item in js_list: DOM = DOM + item html_type = "<html><meta http-equiv='Content-Type' content='text/html; charset=utf-8' /><head></head><body> <script type='text/javascript'>" # 拼接成一个可以运行的网页 js = html_type + DOM + " document.write(rules)</script></body></html>" # 再次运行的时候,请把文件删除,否则无法创建同名文件,或者自行加验证即可 with open("./demo.html", "w", encoding="utf-8") as f: f.write(js) # 通过selenium将数据读取出来,进行替换 driver = webdriver.PhantomJS() driver.get("./demo.html") # 读取body部分 text = driver.find_element_by_tag_name('body').text # 匹配车辆参数中所有的span标签 span_list = re.findall("<span(.*?)></span>", car_info) # car_info 是我上面拼接的字符串 # 按照span标签与text中的关键字进行替换 for span in span_list: # 这个地方匹配的是class的名称 例如 <span class='hs_kw7_optionZl'></span> 匹配 hs_kw7_optionZl 出来 info = re.search("'(.*?)'", span) if info: class_info = str(info.group(1)) + "::before { content:(.*?)}" # 拼接为 hs_kw7_optionZl::before { content:(.*?)} content = re.search(class_info, text).group(1) # 匹配文字内容,返回结果为 "实测""油耗""质保" car_info = car_info.replace(str("<span class='" + info.group(1) + "'></span>"), re.search("\"(.*?)\"", content).group(1)) print(car_info)
运行结果
![](https://ask.qcloudimg.com/http-save/yehe-4543082/fszpd1sfql.png?imageView2/2/w/1620)
对比一下原来数据,发现问题不大,完成任务。
![](https://ask.qcloudimg.com/http-save/yehe-4543082/iyx8wum7rr.png?imageView2/2/w/1620)
入库操作
剩下的步骤就是数据持久化了,数据拿到之后,其他的都是比较简单的,希望你可以直接搞定。
小扩展:格式化JS
碰到这种JS,直接找到格式化工具处理它
http://tool.oschina.net/codeformat/js/
格式完成之后,代码具备一定的阅读能力
思路汇总
汽车之家用CSS隐藏了部分真实的字体,在解决的过程中,需要首先针对class去查找,当找到JS位置的时候,必须要搞定它的加密规则,顺着规则之后,只需要完成基本的key、value替换就可以拿到真实的数据了。
from: https://cloud.tencent.com/developer/article/1423765