Free HTML5 serial came the "HTML5 Web development Case detailed" series (v) illustrated by the Fiddler accelerated development

Fiddler is the most powerful Request Agent debugging tool under Windows, monitoring the HTTP/HTTPS traffic of any browser, tampering with client requests and server responses, decrypting HTTPS Web sessions, Figure 4.44 is the fiddler principle.

Figure 4.44 Fiddler principle

Fiddler installed system requirements for Windows XP or version in Windows 8, where Fiddler2 relies on the Microsoft.NET Framework 2.0, the latest FIDDLER4 relies on Microsoft.NET Framework 4.0.

Fiddler features a lot, here is the most commonly used proxy function. If there is a function in the maintenance of the Web site script problem, this time using the traditional method, the content of the Web page to be completely saved to the local, and then debug the corresponding code, it is obvious that this method appears to be cumbersome, fiddler solve the problem seems to be easy. To do is, save the corresponding problem script to the machine local, modify the script and through the Fiddler proxy, the following through a Baidu Homepage Operation example demonstrates the process.

(1) Open fiddler, select its right "autoresponder" tab, tick "Enable Automatic Responses" and "unmatched requests passthrough" check box, 4.45 shown.

Figure 4.45 Opening fiddler

(2) Open the Chrome browser, enter "Http://www.baidu.com" in the Address bar and press ENTER to enter, at this time, Baidu home page request will be fully displayed in Fiddler to the left of the list, 4.46 shows.

Figure 4.46 Baidu home page request list

(3) Select the 5th request in the list (the request is a JavaScript script), click and drag above the request to the blank list below the "Autoresponder" tab on the right, as shown in 4.47.

Figure 4.47 Proxy a script request

(4) Copy the URL address of the 5th request, open it with a browser and save the script contents to the machine local folder

(5) Add 1 lines of code at the end of the script you just saved:

Document.body.style.backgroundcolor= ' black '//Modify the page background color to Dark

(6) Modify the "Then respond width:" button on the right side of the Fiddler "autoresponder" tab below the list. column, point to the local saved script code address, 4.48.

Figure 4.48 Modifying the local proxy address of the request

(7) Open the Chrome browser, enter "Http://www.baidu.com" in the Address bar and press ENTER to enter, at this time Baidu home becomes black, fiddler agent success.

Hint: The function completed in the example is just a simple simulation, the reader in the actual development through the Fiddler agent, modify the specific code of the local script, and combined with the Chrome browser debugging function, solve the online problem of the website will be simple and efficient.

Study HTML5 The best book is "HTML5 Web development Example of the detailed", using code learning case study, can be more interesting than reading text!!! A book to fix HTML5, starting from now.