FireBug in Web hacker toolbox: insight into complex Web applications (1)

Bkjia.com exclusive Article] Firefox Firebug extension is a full-featured Web application debugger that helps Web Hackers understand the internal working mechanism of complex Web applications. It has two versions: Firebug Lite, a component that can be used across browsers, and Firebug extension dedicated to Firefox browsers. This article focuses on the usage of the former.

I. Introduction

Browser extension Firebug provides an integrated environment in which we can perform a comprehensive analysis on the Web applications we are interested in. See figure 1 ). It provides many functions to explore the DOM structure, dynamically modify HTML code, track and debug JavaScript code, and monitor network requests and responses.

Figure 1 browser extension Firebug

Ii. Use the Firebug console to hijack Functions

The Firebug console can be used to calculate expressions. The function is similar to the command line JavaScript interpreter. In the console, we can not only enter JavaScript expressions (for example, Alert ('message');), but also receive error messages. As shown in:

Figure 2 Firebug Console

You can also insert code dynamically. For example, if you want to test a Web application, the program has a method to export data from a window object, called javasmrequest. The application uses this method to send requests from the client to the server. We are more interested in the information of this function request, so we will provide the following commands in the console to hijack this method:

window._oldPerformRequest = window.performRequest; window.performRequest = function () { console.log(arguments); window._oldPerformRequest.apply(window, arguments) }

The above code will actually replace the original callback mrequest function with our own function, and all the parameters will be listed in the console during function execution. When the function call ends, we redirect the code flow to the original receivmrequest defined by old?mrequest, which will perform the required operations. Now we know how to hijack a function without modifying the Web application method.

Ii. Use Firebug to browse and dynamically modify HTML elements

Many Web developers and designers often ignore the readability of HTML source code, especially pages generated by WYSIWYG editors. This makes it more difficult for us to review its source code. In this case, we need to use other tools to reorganize various parts of the page. Of course, we can use DOM Inspector to explore these poorly structured HTML source code, and Firebug can achieve the same purpose. below is the HTML view of Firebug.

Figure 3 HTML view of Firebug

3. You can select and expand each HTML element in the current view. When you move the cursor over an element, the browser will highlight the corresponding element. The window on the right shows the style, layout, and DOM features. DOM information is extremely useful. It is almost the same as DOM Inspector when you want to query various types of attributes. In addition, we can also use it to explore the application program running mechanism. For example, AJAX application developers often add additional attributes for images, links, and other types of html elements, which may be a key part of the application logic.

The HTML view can also be used to dynamically modify the structure of an application document. You can press the delete key on the keyboard to delete the selected element or modify the attribute of each element by double-clicking the element attribute and setting its value. Note: Changes to the HTML structure may not work for page update events. If you want to fix the changes, you can use the GreaseMonkey script.

Iii. Use Firebug to debug JavaScript scripts

Ajax applications usually involve JavaScript, XML, and on-demand information retrieval. They are often larger than normal applications and run like desktop applications. Because JavaScript is widely used, you will find that the standard Vulnerability Assessment Program will not be able to cover all possible attack methods. Like binary program testing, we need to use a debugger to track code, analyze program structures, and investigate potential problems. Firebug provides all of these features for us, the Firebug script debugger view is displayed to us.

Figure 4 Firebug script debugging View

In Figure 4, we can see a breakpoint, which is located in row 2nd. A breakpoint is a pseudo command that notifies the JavaScript interpreter to stop/stop the process when the Code reaches the breakpoint. Once the program is suspended, we can view the current data stored in global and local variables, and even update them. We can not only use it to understand what the program is doing, but also gain full control over the application.

On the Right of Figure 4, you can see the monitoring and breakpoint list. The breakpoint list contains all the breakpoints we set in the code currently being debugged. You can quickly disable and enable breakpoints without knowing the exact location of the breakpoint.

The monitoring list provides a mechanism to monitor changes in the DOM structure. For example, if you want to know the changes of a value during the running of the program, you only need to create a corresponding monitoring entry.