本文探讨了Web应用作为安全学习的绝佳平台，强调了其自包含和透明的特性，使得无需大型实验室即可进行实践。通过演示Firefox（及Chrome）的开发者工具，文章展示了如何检查和修改DOM、截屏、提取数据、利用控制台执行JavaScript以及使用调试器暂停脚本执行。作者认为，熟练运用这些工具，可以在很大程度上独立完成Web应用渗透测试，而无需离开浏览器。

Web应用因其自包含和透明的特性，是学习和实践安全测试的理想选择。它们易于在本地环境（如虚拟机或Docker容器）中运行，且用户可以轻松查看其客户端源代码，使得“黑盒”测试的概念变得模糊。

浏览器开发者工具（如Firefox和Chrome中的工具）极大地增强了“查看源代码”的功能，提供了强大的能力，包括检查和修改DOM、截屏、查找和提取关键数据、在站点源上下文中运行JavaScript，以及利用调试器暂停脚本执行。

掌握浏览器开发者工具，可以帮助安全专业人员在很大程度上独立完成Web应用渗透测试的大部分工作，而无需离开浏览器环境，大大提高了测试效率和可行性。

I like webapps, don’t you? Webapps have got to be the best way to learn about security. Why? Because they’re self-contained and so very transparent.



You don’t need a big ol’ lab before you can play with them. You can run them in a single tiny VM or even tiny-er Docker image on your laptop. And so long as you’re attacking your own stuff, it’s easy to stay out of trouble. You’re up and running in the time it takes for a single download.



And the transparent part? Ever since “view source” in the earliest web browsers, it’s been easy to see exactly what’s going on in a webapp and in the browser. Every webapp you ever use has no choice but to give you the (client-side) source code! It’s almost like there’s no such thing as a “black box” webapp pentest if you think about it…



Anyhow – the Developer Tools in Firefox (and Chrome) are what happens when you take “view source” and add 25 years or so of creativity and power.



We’ll look at the Developer Tools in the latest Firefox with a pentester’s eye. Inspect and change the DOM (Document Object Model), take screenshots, find and extract key bits of data, use the console to run Javascript in the site’s origin context, and even pause script execution in the debugger if things go too fast…



Maybe we’ll convince you that you can realistically do a big chunk of a webapp pentest without ever leaving the browser.



Join the BHIS Discord channel — https://discord.gg/aHHh3u5



Slides for this webcast can be found here: https://www.blackhillsinfosec.com/wp-content/uploads/2020/09/SLIDES_HowToDeveloperToolsWebappPentesting.pdf



0:00 – A Shady-White Slideshow with “FREE TOOLS!” On the Sign



0:38 – The Way Back Machine



11:00 – Always Be Learning



18:01 – The Path to the Developer Tools



24:37 – Console Separately From a Window



30:40 – The Network Tab



36:23 – Storage Tab



38:20 – All The Cookies