如何在 Chrome 扩展程序或控制台命令上提取 JavaScript 源？答案

【问题标题】：How can I Extract JavaScript Source on Chrome Extension or Console-Command?如何在 Chrome 扩展程序或控制台命令上提取 JavaScript 源？
【发布时间】：2017-02-07 04:49:23
【问题描述】：

HTML： <html> <script scr="http://someurl.com/jscript.js"></script></html>

我正在尝试在 chrome 扩展中提取 jscript.js 的源代码。

但是没有 DOM Object 的属性持有 js 的来源。

有没有办法提取页面上加载的 JavaScript 源代码？（通过使用DOM对象或一些内部对象，除了重新下载脚本）

因为..一些网络服务器返回不同的源代码取决于请求包（通常..坏服务器会这样做）。因此，如果我尝试使用不同的请求下载它，我将无法获得与浏览器上加载的相同的请求。

【问题讨论】：

不确定我是否理解这个问题。在 devtools 中，源代码显示在 Sources 面板中。在扩展中，您可以使用 XMLHttpRequest 或各种类似物重新下载脚本。
@wOxxOm 我想这个问题可以阅读“是否可以仅使用 DOM 获取内容”。并且，隐含地，“如果不是，如何处理它”。
@wOxxOM 感谢您的评论。是的，我看到了重新下载它们的方法。但我只是想用 DOM 或浏览器的一些内部对象来获取它们:)
@Xan 对。你完善了我的问题:)。谢谢。

标签： javascript google-chrome dom google-chrome-extension inspect

【解决方案1】：

根据Is external JavaScript source available to scripting context inside HTML page?，通常不重新下载是不可能的，因为它没有暴露给 DOM。

扩展，然而，可以挂钩到浏览器可用的信息。

最简单的方法是创建一个DevTools extension。它仅在页面上打开 DevTools 时才有效，但随后您可以使用 chrome.devtools.inspectedWindow.getResources() 轻松访问源代码。

有点困难，但可以在 DevTools 关闭时使用chrome.debugger API 来实现相同的目的。它是一个低级 API，但它允许执行 DevTools 可以执行的所有操作。我没有现成的示例，但 Debugger Protocol 文档会有所帮助。

内容脚本也不可能。

【讨论】：

谢谢 :) 很有帮助。
您还可以查看开发工具的 Sources 部分。为了简化问题，创建一个 hello world 的虚拟网站
如果你想要后台脚本信息，你必须去扩展并点击检查后台页面，有时你会发现你所在页面的源部分的内容脚本信息on 和背景页面的源部分的内容，其中将包含背景脚本。
您可能需要在开发工具的源代码部分中将页面选项卡更改为内容脚本选项卡。

【解决方案2】：

您也可以直接转到文件系统上的扩展：

Where to find extensions installed folder for Google Chrome on Mac?

例如在我的 mac book 电脑上：

pwd

输出：~/Library/Application\ Support/Google/Chrome/Default/Extensions/hkbhjllliedcceblibllaodamehmbfgm/1.7.1_0

【讨论】：