学习篇（一）_油猴 js混

学习js逆向课程

一、js反爬的原理

反爬虫定义：限制爬虫程序访问服务器资源和获取数据的行为称为反爬虫。限制手段包括但不限于请求限制、拒绝响应、客户端身份验证、文本混淆和使用动态渲染技术。可分为主动型反爬和被动型反爬。

二、javascript

1、数据类型

Object对象：是以Key-Value键值对的的形式存在的集合，键都是字符串类型，值是任意类型。其拷贝分为深浅拷贝，浅拷贝只复制对象内存地址，类似于指针；深拷贝则是完全克隆，生成一个新的对象。
Array数组：是一个有序排列的集合，值为任意类型，也分为深浅拷贝。其形式与python的list类似。注意：splice方法既可以添加也可以删除；map遍历方法会返回一个新的数组，forEach遍历不会。
String字符串：由单引号/双引号定义的类型
Number数字：任何表示数字的类型
Boolean布尔值：true/false
Map映射：也是Key-Value对关系的集合，但其键可以为任何类型。
Set集合：相当于不重复值的数组。
null/undefined：null表示空值；undefined表示未定义。因此比较通常用三个等号（===），赋值用null。

2、控制流

循环：while、for、Array.map、Array.forEach
条件判断：if(){}else{}
函数
定义：
1、带函数名
      function funcName(param){statement}
2、匿名函数
      (function(param){statement}())
变量作用域
定义：var，const，let定义的变量有作用域，var定义的变量在各自的函数内部起作用，const、let定义的变量为块级作用域
变量提升：扫描整个函数体的语句，将所有申明变量提升到函数顶部。（即不会出现变量未找到）
全局作用域：如果不指定var，const，let申明关键字来定义，该变量将会绑定到window全局变量上
块级作用域：let、const将作用在for、while等循环语句里
高阶函数
定义：接收另一个函数作为参数的函数被称作高阶函数
用途：回调函数（Callback）、数组操作（filter、sort、map、forEach）
闭包
定义：函数的返回值可以为函数；所有的参数和变量都保存在返回函数中；当调用返回函数时才会执行所有的运算逻辑。
用途：匿名自执行函数；封装；结果缓存。
特殊对象
JSON：JSON、对象的序列化（stringify）/反序列化操作（parse）
Date：JS的时间操作对象（new Date(dateString)）

3、进阶

事件循环（Event Loop）
定义：主线程不断地重复获取执行消息、再获取执行不断循环的机制被称为事件循环
背景：JS是单线程；再处理异步操作的时候需要事件循环机制
相关概念：堆（Heap）：大块非结构化内存区域，储存对象、数据；栈（Stack）：调用栈，储存该次循环待主程序执行的任务；队列（Queue）：事件队列，先进先出被推入调用栈中
拓展：宏任务（Macro Task）和微任务（Micro Task）；Node.js事件循环
原型链
概念：
prototype指向函数的原型对象；
__proto__每个new出来的对象都有一个这个属性指向对象的原型；
constructor每个原型都有一个这个属性指向该关联的构造函数
应用：继承、代码复用
异步编程
回调函数Callback：通过传入回调函数作为参数再函数中异步执行，优点是简单，缺点是回调地狱（ES5）
Promise：ES6中出现的异步解决方案，可以获取异步操作消息的对象，resolve/reject，then/catch，油电是解决了回调地狱，缺点是可读性不高（ES6）
async/await：ES8（ES2017）中出现的异步解决方案，基于Promise的语法糖，需要了解Promise相关知识。async返回Promise对象，async函数遇到await时会终止运行，直到相应的Promise状态变为resolved。优点是解决了Promise代码可读性问题，缺点是多个并行异步操作需要用Promise.all来执行（ES8）
ps:逆向过程中通常不会看到async/await语法。
浏览器存储
Cookies：主要用于与服务端通信，储存量小
LocalStorage：储存量比Cookies大，但只能储存字符串
SessionStorage：只存在于当前Session，关闭浏览器丢失。其他与LocalStorage一致
IndexedDB：相当于浏览器上的SQL数据库，有更大的储存空间，但API较难掌握
跨域
定义：客户端与不同源的服务端通信
解决办法：
    CORS：跨域资源共享，解决跨域请求的成熟方案，但可能会暴露接口
    JSONP：基于<script>标签具有可跨域特性，但只能用于GET请求
    iframe：通过<iframe>标签再一个页面展示不同源的页面，通过PostMessage进行页面之间的通信
    反省代理：通过反向代理让客户端与服务端保持同源
Webpack打包
目的：将不同类型的源文件编译打包成静态文件
使用背景：前端技术纷繁复杂，缺乏统一管理；大型项目需要模块化；对于JSX、TS之类的新技术需要编译之后才能使用
需要配置特定的编译器，通常使用Babel
提供很多插件，以支持更多的特殊功能
有大量的配置，需要对配置进行优化

三、调用js执行代码

使用原因：
简单的JS破解可以直接通过python代码轻松重写
复杂的JS破解其代码不容易重写，此时直接调用JS并运行获取结果就很有必要
python调用JS
PyV8是V8引擎的一个Python层包装，可以调用V8引擎执行JS代码。不推荐使用！最新的正式版本是2010年的，已经年久失修，使用过程中还存在内存泄漏问题。
Js2Py是一个纯Python实现的JS解释器和翻译器，虽然有更新，但也时间久了，并且有很多bug未修复。其解释器性能不高，存在bug，翻译器对高度混淆的大型JS会转换失败，且转换后的代码可读性差、性能不高。也不推荐使用。
PyMiniRacer同样是V8引擎的包装和PyV8效果一样，一个继任PyExecJS和PyV8的库，比较新，坑多。
PyExecJS最开始诞生于Ruby中的库，后移植到python上，多个引擎可选，一般使用NodeJS来作为引擎。缺点：执行大型JS会很慢，特殊编码的输入输出参数会出现报错（可以把输入输出的参数使用Base64编码一下）
Selenium一个Web自动化测试框架，可以驱动各种浏览器进行模拟人工操作；用于渲染页面以方便提取数据或过验证码；也可以直接驱动浏览器执行JS。核心代码browser.execute_script(js)
Pyppeteer是Puppeteer的Python版本，是一个Web自动化测试框架。原生支持以携程的方式调用，比Selenium更高。对于使用Asyncio+Aiohttp写爬虫的人而言可以直接使用。核心代码await page.evaluate(js, *data)。想在页面加载前调用await page.evaluateOnNewDocument(js, *data)。需要asynicio知识。
更好的方案：
使用NodeJS直接执行JS
写一个简单RPC服务接口，然后调用JS。可以使用Google出品的gRPC框架，和正常些API一样，调用一下目标JS就好了。
HTTP API
提供一个可以执行JS的HTTP API，然后通过调用API来执行JS并获取想要的结果。可以使用Nodejs的Express框架来实现。

const express = require('express')
const app = express()
const crypto = require("./crypto")
var bodyParser = require('body-parser');
app.use(bodyParser());
 
 
app.post('crypto', function （req, res) {
    let result = req.body
    console.log(result)
    let user = result.user
    let pwd = result.password
    result = crypto.Encrypt(user, pwd)
    res.send(result);
})
 
app.listen(3000, () => {
    console.log("开启服务，端口3000")
})

ps:最好将需要运行的js打包成js文件。
经常遇到的问题
window/document对象，NodeJS没有window对象，如果需要window对象需要自己创建一个或者指向global。也可以使用jsdom之类的库。
Base64，window.btoa再nodejs中不存在，可以使用Buffer.from('NightTeam').toString('base64')

四、浏览器开发者工具的介绍和使用技巧

以Chrome浏览器为主。windows使用Ctrl+Shift+I打开/Mac使用Cmd+Opt+I打开/右击检查也可以/F12也可以
开发者工具面板：
Elements（元素面板）：可以操作DOM和CSS来调整网站的布局和设计，并且可以简单修改网站内容
Console（控制台面板）：记录诊断信息，或者可以使用他与页面上的JS进行交互
Sources（源代码面板）：通过设置断点来调整JS，或者使用工作区域链接本地的文件来使用开发者工具自带的实时编辑器来修改我们的源代码
Network（网络面板）：用于抓包，查看请求的请求头、响应等
Performance（性能面板）：可以使用时间轴来通过记录/查看网站生命周期内发生的各项时间，来提升运行性能。
Memory（内存面板）：可以用来分析页面的执行时间以及内存的使用情况
Application（应用面板）：记录网站加载的所有资源信息
Security（安全面板）：调试混合内容问题，证书问题等
Audits（审核面板）：对网页当前的利用情况或者网页的性能进行诊断，并给出一些优化建议
Chrome开发者工具官方文档：https://developers.google.com/web/tools/chrome-devtools (需要翻墙)

Network面板

分为5个部分：
控制器：可以用来控制网络面板的外观还有功能。从左往右按钮功能依次是：是否抓包、清除、关闭网格、检索、是否跨页面保存、是否禁用浏览器缓存（是否每次都请求资源）、慢速网络模拟
过滤器：控制请求列表显示的资源。通过资源类型、关键字来筛选显示的请求。关键字：
    domain：资源所在域，即URL中的域名部分。格式：domain:api.github.com
    has-response-header：资源是否存在响应头，无论其值是什么。格式：has-response-header:Access-Control-Allow-Origin
    is：当前时间点在执行的请求。值：running
    larger-than：显示大于指定值大小规格的资源。单位是字节（B），KB\MB也可以。格式：larger-than: 150K
    method：使用何种HTTP请求方式。格式：method: GET
    mime-type：也写作content-type，是资源类型的标识符。值：text/html
    scheme：协议规定。值：HTTPS
    set-cookie-name：服务器设置的cookies名称
    set-cookie-value：服务器设置的cookies的值
    set-cookie-domain：服务器设置的cookies的域
    status-code：HTTP响应头的状态码
概览：显示请求的时间线
请求列表：请求过程中的每个请求。关键内容：Initiator，发起位置。使用shift加悬停/点击可以查看请求间的依赖关系
概要：从数据角度，发起了多少请求，传输多少数据，使用了多少时间。

Source面板

大体分为三部分：左边是文件导航窗格，对文件目录进行浏览；中间是编辑器窗格，对代码进行编辑、设置断点等；右边是调试窗格，包含调试的常用选项。
文件导航窗格：Page是以文件目录形式展示当前页面加载的资源目录。FileSystem面板可以让开发者工具加载本地的文件系统，并且能在编辑窗口修改编辑，化身IDE。Overrides可以将远程的资源下载一份放在本地，并提供编辑以及编辑后的文件效果（相当于将请求代理到本地的文件中）。Content scripts中是Chrome插件加载的一些脚本。Snippets是代码片段部分，可以事先保存一些脚本代码。
代码编辑窗格： 条件断点。

Console面板

主要功能是打印信息、执行js代码等。
    console.info输出提示信息
    console.error输出错误信息
    console.warn输出警示信息
    console.assert断言
    console.count每次输出的内容是这个函数被调用的次数
    console.table以表格形式展示数据
    Copy(...)复制变量。复制后使用粘贴功能
    $_记录了最后一次运算的结果
    $、$$ = document.querySelector、document.querySelectorAll
    $X结合Xpath

五、常用工具介绍和使用技巧

1、Charles

使用流程：安装charles；Help-SSL Proxying- Install Charles Certificate给本机安装证书（要信任）；给PC/手机安装证书。
    httpbin.org可以模拟大多数请求，供练习测试。
    设置断点：指定url，可以在发起请求、收到结果的时候进行断点修改。
    模拟网速Throttling。
    反向代理：发起一次请求时会经过配置的代理发请求，然后将结果返回客户端；remote做映射关系；Map local与本地文件做映射关系，以替换结果。 

2、EditThisCookie

是Chrome的一个插件。如果没有资源，则需要翻墙下载。可以比较方便的管理、修改、导入导出网站的cookie。 

3、ToggleJavaScript

是Chrome的一个插件。如果没有资源，则需要翻墙下载。提供开启、关闭JS的功能。

4、Tampermonkey

是Chrome的一个插件。如果没有资源，则需要翻墙下载。可以在浏览器中自定义执行一些JS脚本。  
在逆向中，Hook，添加钩子，将其中函数修改/添加某些函数。                                                                                

// ==User Scripty--
// @name        HookBase64
// @namespace    网址
// version    0.1
// description    Hook Base64 encode function
// author    Germey
// @match    匹配的网址
// grant    none
// ==/UserScript==
(function () {
    'use strict'
    function hook(object, attr){
        var func = object[attr]
        object[attr] = function () {
            console.log('hooked', object, attr)
            var ret = func.apply(object, arguments)
            debugger
            return ret
        }
    }
    hook(window, 'btoa')
})()

这是一个hookebase64的简单油猴脚本，原理上是使用匿名函数，将btoa函数修改为新的（自定义）的函数。本例中加入了输出语句以及断点。当hook到指定（此处为btoa）函数时，可以通过调用栈找到调用的位置，即找到想要的加密位置。

六、无限debugger

1、主要作用

阻止我们调试和分析目标代码的运行逻辑

2、实现

Function/eval 'debugger'    function debugger

3、解决方案

禁用所有断点
禁用某处的断点（右键Never pause here）
条件断点 
中间人工具替换特征字符串（hook）
reres替换本地修改过的文件 
重写关键函数（断点打在其实际运行之前，然后将其重写）

PS：函数+“” 得到函数体

七、定位加密参数对应代码位置的方法

快速定位之搜索

elements搜索，只能在页面内容（html文本）中搜索。
全局搜索。
请求搜索（过滤）

快速定位之断点

根据请求类型打对应类型的断点（xhr断点） 
根据dom节点的更改/删除进行断点（dom断点）
根据事件的发起/结束打断点（Event断点）（Elements的Event Listeners子标签项）  
直接从请求的发起处开始打断点

快速定位之hook

json、cookie、window attr、eval/Function、websocket、and so on(getBytes)

快速定位之分析

Elements Event Listeners(事件监听)、Network type initator(跟踪请求触发来源)、Console Log XMLHttpRequests(打印请求日志)

八、代码混淆的原理

混淆原因：JS代码运行于客户端，代码公开透明，容易被盗用
混淆方案：代码压缩（去除空格，换行）；代码加密（eval，emscripten、WebAssembly）；代码混淆（变量混淆、常量（字符串）混淆）、属性加密、控制流平坦化、僵尸代码注入、反调试、多态变异、锁定域名、反格式化、特殊编码）
开源项目：UglifyJS(https://github.com/mishoo/UglifyJS2)、terser(https://github.com/terser/terser)、javascript-obfuscator(https://github.com/javascript-obfuscator/javascript-obfuscator ※※※※)、jsfuck(https://github.com/aemeki/jsfuck)、AAEncode(https://github.com/bprayudha/jquery.aaencode)、JJEncode(https://github.com/ay86/jEncrypt)
商业服务：https://javascriptobfuscator.com/    https://jscrambler.com/ ※    http://stunnix.com/

九、处理常见代码混淆操作的方法

加密分析流程：
    1、查看关键包-分析哪些参数是加密的
    2.0、搜索参数
        参数名=  参数名 =    参数名:    参数名 :
        参数名
    2.1、查看网络面板的Initiator（发起）
    2.2、xhr断点调试
    2.3、hook相关逻辑
    3、分析加密
    4、补全加密逻辑

对于颜文字混淆、符号混淆等使用混淆网站、混淆器  替换混淆方式，可以将代码直接复制到console面板粘贴运行，若有错则可进入VM虚拟空间看到代码；若没有错误，可以删除最后一个表情/括号(' ()')再运行，也可以删除之后使用.toString()方法。

Function会用构造函数动态的创建一个函数，然后将传入的参数顺序传入并执行。

[]()!+这样的混淆可以将最后一对的()包含的代码抽离出来单独运行。（因为最后一对括号是eval函数的传参处）

十、掌握常见的编码和加密

Ascii码，美国信息交换标准代码，是基于拉丁字母的一套电脑编码系统，主要用于显示现代英语和其他西欧语言，是最通用的信息交换标准，等同于国际标准ISO/IEC 646。到目前为止共定义了128个字符。

Base64是一种特定的编码方式，用指定的64个字符来对任意的数据进行编码。其原理是将二进制的数据转成文本数据，对于非二进制方式都先转成二进制，连续使用6比特计算十进制的值，对应索引的码表。主要用于图片的二进制显示。可自定义码表

MD5讯息摘要演算法，是一种被广泛使用的密码杂凑函数，可以产生出一个128位元（16位元组）的数列值，用于确保信息传输完整性。其功能为：输入任意长度的信息，经过处理，输出为128位的信息（数字指纹）；不同的输入得到的不同结果具有唯一性。主要用于：防止篡改（下载文件时校验文件的md5是否和公共的一致）；防止看到明文（csdn的密码使用明文存储，导致撞库更加容易）

AES高级加密标准，在密码学中又称Rijndael加密法。是美国联邦政府采用的一种区块加密标准。AES属于对称加密，使用过程用简单的公式如：
    secret = encrypt(key, message)  输入要加密的信息、密文，输出加密后的明文
    message = decrypt(key, secret)  输入加密后的明文和key，可以解读出原始的信息
ps：常用的对称加密算法：DES加密，密钥长度为56/64位，工作模式包含ECB/CBC/PCBC/CTR/...，填充模式包含NoPadding/PKCS5Padding/...；AES加密，密钥长度为128/192/256位，工作模式包含ECB/CBC/PCBC/CTR/...，填充模式包含NoPadding/PCKCS5Padding/PKCS7Padding/...。
密钥长度直接决定加密强度，而工作模式和填充模式可以看成是对称加密算法的参数和格式选择。

十一、控制流平坦化

概念：通过引入状态机与循环，破坏代码上下文之间的阅读连续性和代码块之间的关联性，将若干个分散的小整体整合成一个巨大的循环体。
特点：无法还原成原来具体的函数；无法以函数为单位的调试方法，大幅度增加调试难度；降低代码运行效率，提高爬虫运行时执行js的资源成本；可根据js运行时检测到的某些因素自由跳到蜜罐或跳出代码执行。
应对： 第一步：全局观察，大致观察每一个代码结构，是否有类似于dom操作的代码，是否为纯计算型的循环体，是否有try-catch异常捕获结构；
           第二步：整体分析与载入，断点定于while开头/定于try代码体第一行/while循环体整体取出构造原始函数
           第三步：构造函数，查缺补漏，再运行的过程中通过不断地运行试错，补充缺失的函数或者数据

十二、服务端返回的神秘字符串

即服务端返回加密内容。部分需要对结果进行处理并再次请求得到完整内容；另一部分则在前端解密。

十三、AES解密

对称加密：一方通过密钥将信息加密后，把密文传给另一方，另一方通过这个相同的密钥将密文解密，转换成可以理解的明文。
非对称加密：通信双方分别需要一套公钥和私钥，并将各自的公钥发送给对方。之后用对方的公钥加密明文，收到信息后用自己的私钥解密成明文。
区别：对称加密与解密用同样的密钥，所以速度快，但密钥会在网络传输，所以安全性不高；非对称加密使用了一对密钥，公钥与私钥，所以安全性高，但加密解密速度要慢一些。
解决的办法是将对称加密的密钥使用非对称加密的公钥进行加密，然后发送，接收方使用私钥进行解密得到对称加密的密钥，然后双方可以使用对称加密来进行沟通。

AES加密

AES加密过程：将明文拆分成一个个独立的明文块，且每个明文块128bit，当出现不足128bit的明文块时，需要进行填充，之后对每个明文块按照工作模式进行加密，最后拼接成最终的秘闻。
密钥：AES支持128、192、256位密钥。
填充：NoPadding（不填充）、PKSCS7Padding（填充的内容为缺少的数量）、ZeroPadding（填充0） AnsiX923、Iso10126、Iso97971
工作模式：CBC、ECB、CTR、CFB、OFB
    ECB是最简单的工作模式，在该模式下，每一个明文块的加密都是完全独立的，互不干涉的。优点是简单，有利于并行计算；缺点是相同的明文块经过加密会变成相同的密文块，因此安全性较差。
    CBC引入了一个IV（初始向量），在该模式下，每一个明文块加密欠会让明文块和一个值做异或操作，而IV会参与第一个明文块的异或操作，后续的每一个明文块和他前一个明文块所加密出的密文块做异或。优点是安全性高；缺点是无法并行计算，性能差，引入的IV增加了复杂度

十四、CSS解密

CSS反爬优点：成本低、效果好
CSS反爬类别：
    利用字体：主要利用了font-family这个属性，使用unicode在字体文件中映射为常见字体，使爬虫在获取数据时只能抓到unicode，而非真实有效的数据。破解方式可以将woff文件下载下来，然后转换成tff文件使用对应的编辑器打开，确定映射关系后，将HTML内容按照映射关系进行替换即可。
    利用背景：将数据以图片背景的方式展示出来，而不是文本。图片包含一张雪碧图，数据利用北京偏移量来获取。破解方式可以将雪碧图下载下来，手动检查其对应的值，然后根据偏移量-值的对应关系将对应的内容替换。
    利用伪类：不将内容展现在HTML中，通过伪类的content属性将内容的值展现出来。难点在于获取指定元素的伪类属性。破解方式可以利用puppeteer或者selenium之类的自动化测试工具，在页面执行el = document.querySelector('.valuable-content')  styles = getComputedStyle(el, 'before')  console.log(styles.content)即可。（before/after都可以)
    利用元素定位：利用绝对定位，将某一个数字火字符将原数字或字符通过一定的偏移量替换，其内容通常来说是随机的，如果直接抓取，将抓取到错误的信息。破解方式计算出替换的元素的偏移量，与被替换元素相比对，还原实际的值。
    利用字符切割：将字符串用标签分割开，由于其是内联块级，可以一行展示，通常还混淆有不显示的标签（display: none）。破解方式将内联块级标签中display: none的标签剔除，然后将剩下的标签的innerText拼接起来。
普遍的CSS反爬策略：
1、通过调试工具人工查看CSS样式；
2、判断CSS反爬类型；
3、根据不同的类型采用不同的应对措施；
4、对于新型的CSS反爬，研究其原理，采用合适的反爬策略。

十五、Base64

魔改Base64

主要通过修改Base64的码表，进行魔改，其运行逻辑不变。

十六、番外

常见加密方式及其密文特点：

MD5提取结果通常是32位，不受明文长度影响；
Base64编码结果末尾通常会出现一到两个等于号，受明文长度影响；
一长串无规律数字与字母组合的字符大概是AES、DES、SHA相关加密；
SHA1加密结果为40位，不受明文长度影响；
SHA256加密结果为64为，不受明文长度影响；
PS：AES、RSA等对称和非对称加密都喜欢将结果用Base64进行编码，以方便传输；
       32为的字符串不一定是MD5摘要结果，64位也不一定是SHA的加密结果

ReRes插件

主要用于将网页资源文件替换为本地文件。
墙外：https://chrome.google.com/webstore/detail/reres/gieocpkbblidnocefjakldecahgeeica?hl=zh-CN&gl=CN
安装后勾选允许访问文件网址。

添加规则：
If URL match ：填入匹配URL的规则，填入的应为正则表达式。但步要填开头的 / 和结束的 /x ，如/.*/g 请写成 .*
Response：天蝎的是映射的相应地址。如果位线上地址则以 http:// 开头；本地地址以 file:/// 开头。