数据爬取 js 分析（一）：Python 爬虫分析网页 js加密解密

在前几天学习 Python 模拟登录知乎实例，其中关于涉及到了 fromdata 的加密处理，再学习的过程中，发现利用 chrome devtool调试分析网页还是有很多技巧需要学习，因此自己找了一个简单的实例用来学习 js 加密。一、实例网站本实例的网站是中国空气质量分析平台，学习利用 chome 浏览器的 devtool 工具对 fromdata 进行加密处理。二、分析页面逻辑1.抓包....

hresh

8942人浏览 · 2019-05-30 15:10:14

hresh · 2019-05-30 15:10:14 发布

写了那么久的博客，始于Python爬虫，目前专于Java学习，终于有了属于自己的小窝，欢迎各位访问我的个人网站，未来我们一起交流进步。

在前几天学习 Python 模拟登录知乎实例，其中关于涉及到了 fromdata 的加密处理，再学习的过程中，发现利用 chrome devtool调试分析网页还是有很多技巧需要学习，因此自己找了一个简单的实例用来学习 js 加密。

一、实例网站

本实例的网站是中国空气质量分析平台，学习利用 chome 浏览器的 devtool 工具对 fromdata 进行加密处理。

二、分析页面逻辑

1.抓包分析

用 chrome 打开该网页，然后按 F12 打开开发者工具 devtool，点击切换到“network”标签页。为了方便查看，先清除之前的请求过程，然后在网页上切换城市，即可看到新的 xhr 请求。
在这里插入图片描述
可以看到模拟登录 POST 的链接，我们最终的目标是构建 POST 请求所需的 headers 和 Form data 这两部分内容。

继续看 Requests Headers 信息，经过对不同城市的查询结果比对，发现 Headers 并未有什么独特的特征，因此我们仅先保留一部分必要信息。
在这里插入图片描述
接着，我们就需要考虑如何构建 Form data 数据。

2.调试分析

考虑到页面点击查询按钮时会发生网络请求，因此按钮肯定会有相应的时间处理。
在这里插入图片描述
在 html 文件中找到查询按钮的位置，接着我们定位到对应的 js 事件。

找到事件方法后，我们接着往下分析。

我们试着进入到 getAQIData() 方法中。

这里发现前台页面查询条件栏的数据，所以我们分析 getServerData 方法，在当前页面没有搜索到该方法的详细内容，因此我们进行全局搜索（ctrl+shift+F搜索）。
在这里插入图片描述
点击跳转到该 js 页面，搜索 getServerData 方法，发现并未搜到，网上查询发现网站为了混淆，该方法被放到了 jqury-1.8.0.min.js?v=1.2 文件中，而且经过混淆处理，可以利用在线工具来反混淆，如：https://beautifier.io/。
在这里插入图片描述
通过开发者工具进行断掉调试，进入 getServerData 方法中。

终于，我们看到了 Form Data ，可以看到该内容是由 getParm() 方法返回得到的。

3.加密分析

知道位置后，我们可以直接把这个加密的 js 方法都扣出来，放在一个 html 文件内执行就好。

var getParam = (function () {
    function ObjectSort(obj) {
        var newObject = {};
        Object.keys(obj).sort().map(function (key) {
            newObject[key] = obj[key]
        });
        return newObject
    }

    return function (method, obj) {
        var appId = '1a45f75b824b2dc628d5955356b5ef18';
        var clienttype = 'WEB';
        var timestamp = new Date().getTime();
        var param = {
            appId: appId,
            method: method,
            timestamp: timestamp,
            clienttype: clienttype,
            object: obj,
            secret: hex_md5(appId + method + timestamp + clienttype + JSON.stringify(ObjectSort(obj)))
        };
        param = BASE64.encrypt(JSON.stringify(param));
        return AES.encrypt(param, aes_client_key, aes_client_iv)
    }
})();

将该方法中涉及到的 js 方法一起提取出来，除了 jqury-1.8.0.min.js?v=1.2 文件中的必需方法之外，我们还需要将 city_detail.html 中的 getAQIData 方法提取出来，将所有的 JavaScript 放入到一个 html 文件，放在 script 标签内即可。

记得将查询条件数据放入到方法中。
在这里插入图片描述

在 js 中执行 document.write(getAQIData())，页面输出正确。

三、Python 实现加密

使用 python 的 execjs 来执行 JavaScript 代码，除了需要安装 execjs 包，还要安装 node 环境。具体安装可以参考网上教程。

    def encrypt(self, form_data):
        '''
        对查询条件栏的数据，进行加密
        :param form_data: 查询条件栏的数据，包括城市名称，开始结束时间等
        :return:加密后的字符串
        '''
        with open('encrypt.js',encoding='utf-8') as f:
            js = execjs.compile(f.read())
            return js.call('getAQIData',form_data)

在测试的过程中，如果遇到 execjs._exceptions.ProgramError: ReferenceError: localStorage is not defined 错误，localStorage 是浏览器端数据存储的方式之一，将 js 中相关代码注释掉，继续测试。

//加密
function getServerData(method, object, callback, period) {
    const key = hex_md5(method + JSON.stringify(object));
    // const data = getDataFromLocalStorage(key, period);
    // if (!data) {
        var param = getParam(method, object);
        return param
    // } else {
    //     callback(data)
    // }
}

成功输出结果。

四、Python 爬取网页

得到加密后的字符串后，需要将该内容通过 POST 请求提交到服务器，不过在实现的过程中，发现返回的内容与与前台返回的不一致。经过一番查询，
在这里插入图片描述
发现获取到的加密字符串内容只是与“view decoded”显示内容一致，我们尝试对数据进行 URL 编码，再进行 POST 请求。最终成功获得返回值。

接下来我们对返回的字符串进行解密，在分析 getServerData 方法分析中发现 decodeData 方法与解密有关。

    def decrypt(self, resp_text):
        '''
        对服务器请求成功后返回的数据，进行解密
        :param resp_text: 返回的数据
        :return:解密后的字符串，json格式
        '''
        with open('encrypt.js',encoding='utf-8') as f:
            js = execjs.compile(f.read())
            return js.call('decodeData',resp_text)

对服务器返回的内容进行解密处理，最后得到我们想要的数据。
在这里插入图片描述
详细代码请前往：https://github.com/Acorn2/SpiderCrack/tree/master/aqistudy