初始AST

简单介绍AST

抽象语法树（Abstract Syntax Tree，AST），或简称语法树（Syntax tree），是源代码语法结构的一种抽象表示。
它以树状的形式表现编程语言的语法结构，树上的每个节点都表示源代码中的一种结构。

工具

在线解析网站：https://astexplorer.net/
选择 JavaScript 和 @babel/parser。

AST 结构简单介绍

在上面的在线解析网站左边输入var a = "\x31\x32\x33\x34\x35\x36";
右边如下图

最上面是根节点，下面是根节点的各个子节点

• type：表示当前节点的类型，我们常用的类型判断方法t.is*****(node)就是判断当前的节点是否为某个类型。
• start:表示当前节点的起始位置。
• end：表示当前节点的末尾。
• loc:表示当前节点所在的行列位置，里面也有start和end节点，这里的start是表示节点所在起始的行列位。
• errors：是File节点所特有的属性。
• program：包含整个源代码，不包含注释节点。
• comments:源代码中所有的注释。

type类型是每个节点都有的节点，经常使用。

然后打开 program中的body，如下图。

这是一个 VariableDeclaration类型的节点。这个节点是变量声明节点。在这个节点下的id的value就是声明值，init.extra.value就是声明量。

下面这图是AST的所有TYPE，会经常使用到。

babel反混淆代码模板

模板来源于 公众号 菜鸟学Python编程。

//babel库及文件模块导入
const parser = require("@babel/parser");
const traverse = require("@babel/traverse").default;
const types = require("@babel/types");
const generator = require("@babel/generator").default;
const fs = require('fs');


// 读取文件
let encode_file = fs.readFileSync("./base64.js", {
    encoding: "utf-8"
});
// 转换为ast数
let ast = parser.parse(encode_file);

const visitor =
    {
       // 写下处理代码

    };

// 调用插件，处理源代码
traverse(ast, visitor);


//生成新的 js code,并且保存到文件中输出
let {code} = generator(ast,opts = {jsescOption:{"minimal":true}});
fs.writeFile('decode.js', code, (err) => {
});

以后使用ast处理混淆代码的时候只需要在visitor中写代码即可。

第一次使用AST

想必大家在爬取数据的时候都会遇到一些网站的JS文件中把中英文进行Unicode编码，如下图这样的，如果只有一两个，我们可以手动替换，如果多了，就没办法手动替换了，这时候就可以采用AST来进行替换。

我们先从简单的来 假如我们base64.js 中的代码为 var a = "\x31\x32\x33\x34\x35\x36。
现在我们要对这个代码就是还原。

const visitor =
    {
        StringLiteral({node})
        {
            if (node.extra && /\\[ux]/gi.test(node.extra.raw)) {
                node.extra = undefined;
            }
            console.log(node)
        },

    };

接下来对代码进行解释：
通过官网查询，StringLiteral类的节点的extra节点并非是必须的，这样在将其删除的时候，不会影响原节点，在 在线网站对其进行解析的时候，其value节点是可阅读的字段，编码后的字符串放在了extra节点里，所以直接进行删除。

const visitor = {
    StringLiteral({node}) 
    {
        // 对type为StringLiteral类型的所有节点进行解析
    };
    NumericLiteral({node}) 
    {
        // 对type为NumericLiteral类型的所有节点进行解析
    };
}

所以用文字对这段代码进行复述就是 遍历类型为 StringLiteral 的节点，如果 node.extra 为真 而且 /\\[ux]/gi.test(node.extra.raw) 为真,则 node.extra = undefined;

执行后得到的结果为：

这样我们就得到逆向之后的JS了，这样看JS文件就比较的清晰了。

学AST，找蔡老板。