Debugger.getScriptSource 如何工作？

Question

我正在尝试运行 chrome 调试器来收集反混淆的 JavaScript，但它返回大量脚本块。我想知道chrome如何将一个JavaScript文件分成多个块？脚本的一大块到底是什么？

我知道对于每个脚本文件、脚本标签和 eval() 函数都会创建单独的块。我只是想查明创建块的所有可能情况。例如，惰性解析是否也会为某些函数创建块？

如果有人能给我提供一些有关该过程如何工作的文档，那就太好了。

Answer 1

该Debugger.scriptParsed事件是为找到的每个脚本生成的事件scriptId。解析的每个脚本文件都会触发该事件，并且应该收到一个唯一的 ID。与单独的脚本文件一样，<script>页面源中标签的每个实例也将获得其自己的 ID。

事件回调传递了许多参数。您可以通过注销对象来检查所有参数arguments。例如，您将获得url脚本文件的返回信息，并为您提供HTML 资源中出现的标签startLine的偏移量。<script>

on('Debugger.scriptParsed', function() {
    console.log(JSON.stringify(arguments, null, 2)(
});

调查

为了回答您更新的问题，我的理解是，在调试器模式下，它将尝试完整解析，而不是尝试通过预解析进行优化。我无法真正理解 v8 代码库，但我做了一些测试。

我创建了一个带有按钮的 HTML 页面和一个单独的脚本文件。我在页面加载后立即执行了一个函数。单击按钮即可执行另一个功能。

document.addEventListener("DOMContentLoaded", () => {
    document.getElementById('clickMe').addEventListener('click', () => clicked);
});

我检查了的输出Debugger.scriptParsed。它立即解析了脚本文件。单击该按钮后，没有其他输出条目。如果我更改处理程序以clicked使用动态调用调用eval，它确实会输出一个新的脚本块。

eval('clicked()');

这是有道理的，因为解析器在执行之前无法知道它。这同样适用于内联处理程序，例如onclick="doSomething()"

我注意到的其他块是 Chrome 扩展 URI 和来自 chrome 的内部 URI。