回归最本质的信息安全

如何使用浏览器网络监视工具进行黑客攻击

2017年6月25日发布

17,230
0
1

导语:使用Web标准构建开发工具使我们能够在不同的环境中运行,本文将向大家展示如何尝试这些操作,并使用网络监视器进行黑客攻击。

timg.jpg

在上一篇《重构后的Firefox网络监视工具,里边加了什么黑科技?》中,除了深入了解重构之后的网络监视器工具,我们还了解到,使用Web标准构建开发工具使我们能够在不同的环境中运行它们比如加载在Firefox Developer Toolbox中,或者作为标准Web应用程序加载到浏览器选项卡中。

在本文中,我们将向你展示如何尝试这些操作,并使用网络监视器进行黑客攻击。

获取源代码

Firefox开发人员工具代码库目前是Firefox源代码库的一部分,因此,下载它需要下载整个repo。有几种方法可以获取源代码并对代码进行处理。你可能需要了解Github文档,以获取详细的说明。

方法之一便是使用Mercurial复制mozilla中央存储库来获取副本。

11.jpg

研究人员使用Web标准构建Web工具时的一部分计划还包括将Firefox的代码库从Mercurial移动到Git(在github.com上)。因此,重构之后,我们可以轻松复制和使用源代码。

运行开发工具箱

现在,如果要构建网络监视器并在Firefox Developer Toolbox中运行,请按照这个详细说明进行操作。

简单来说,你需要做的就是使用mach命令。

112.jpg

构建完成后,启动编译的二进制文件并打开开发工具箱(工具 – > Web开发人员 – >切换工具)。

如下所示,对源代码进行更改后,你可以快速重建。

113.jpg

运行开发服务器

为了在网页中运行Net Monitor,你需要安装以下软件包:

Node
NPM
Yarn
重构之后的Firefox

Firefox的开发人员开发了一个简单的容器,允许在网页内运行Firefox开发工具。这就是Launchpad。 Launchpad负责连接到被调试的Firefox的样本,并加载网络监视器工具。

下图描绘了整个概念:

114.png

1.网络监视器工具(客户端)正像任何其他标准Web应用程序一样在浏览器选项卡中运行。

2.该应用程序由开发服务器(服务器)通过localhost:8000提供

3.Net Monitor工具(客户端)通过WebSocket连接到目标(调试)的Firefox样本。

4.目标Firefox实例需要在端口6080上监测以允许创建WebSocket连接。

5.开发服务器开始使用 yarn 启动

我们来看看如何设置开发环境。

首先我们需要为我们的开发服务器安装依赖项:

115.jpg

然后我们可以运行它:

116.jpg

如果一切正常,你应该看到以下消息:

117.jpg

接下来,我们需要在目标Firefox浏览器中监测传入连接,从而进行调试。打开开发人员工具栏(工具 – > Web开发人员 – >开发工具栏),并在其中键入以下命令。就将开始监测,所以工具可以连接到这个浏览器。

118.jpg

开发者工具栏界面应该在浏览器窗口的底部打开。

119.png

最后,你可以加载localhost:8000

1110.png

你现在应该会看到Launchpad用户界面,它列出了目标Firefox浏览器中打开的浏览器选项卡。你还应该看到,其中一个选项卡是Launchpad本身(在localhost:8000运行的最后一个net monitor选项卡)。

你只需单击要调试的其中一个选项卡即可,一旦Launchpad和网络监视器工具连接到所选的浏览器选项卡,你就可以重新加载连接的选项卡,并查看HTTP请求的列表。

1111.png

如果你更改底层的源代码并刷新页面,你将立即看到你的更改。

查看以下视频,以便对启动板顶部运行的网络监视器工具有更加详细的了解,并利用热加载(Hot Reload)功能立即查看代码更改。

另外,你可能还需要阅读文档以获取有关如何构建和运行网络监视器工具的更多详细信息。

未来我们会继续关注如何将该工具连接到Chrome、NodeJS,并与现有IDE集成。

本文翻译自https://hacks.mozilla.org/2017/06/hacking-on-the-network-monitor-developer-tool/,如若转载,请注明原文地址: http://www.4hou.com/technology/5766.html

点赞 1
取消

感谢您的支持,我会继续努力的!

扫码支持

打开微信扫一扫后点击右上角即可分享哟

xiaohui

xiaohui

嘶吼编辑

发私信

发表评论