Free HTML5 serial to the "HTML5 Web development Case Specific Explanation" series (v) illustrated by fiddler accelerated development

Fiddler is the most powerful Request Agent debugging tool under Windows. Monitor HTTP/HTTPS traffic regardless of browser, tampering with client requests and server responses. To decrypt the HTTPS Web session, Figure 4.44 is the fiddler principle.

Figure 4.44 Fiddler principle

Fiddler installed system requires a version number in Windows XP or Windows 8. The Fiddler2 relies on the Microsoft.NET Framework 2.0, and the latest FIDDLER4 relies on the Microsoft.NET Framework 4.0.

The fiddler feature is very versatile and introduces one of the most frequently used proxy functions.

If there is a feature on the maintained site line that has a scripting problem. At this time adopt the traditional method, the content of the Web page is completely saved to 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 this, save the corresponding problem script to the machine locally, alter the script and pass the Fiddler proxy. The following is a demonstration of the process through a sample operation of the homepage of Baidu.

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

Figure 4.45 Opening fiddler

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

Figure 4.46 Baidu home page request list

(3) Select the 5th request in the list (the request is a JavaScript script). Click above the request and drag to the right side of the "Autoresponder" tab under the Blank list, 4.47 see.

Figure 4.47 Proxy a script request

(4) Copy the URL address of the 5th request. Use browser to open and save script contents to machine local directory

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

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

(6) Change Fiddler "Then respond width ..." In the list below the "Autoresponder" tab on the right side of the page. Column to point to the locally saved script code address. 4.48 of what you see.

Figure 4.48 The local proxy address of the change 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 succeeded.

Tip: Demonstrating the complete functionality of the sample is just a simple simulation in which the reader is able to use the Fiddler agent in Real-world development. Change the detailed code for the local script. Combined with Chrome's debugging capabilities, solving the online problems of your site will be simple and efficient.

Learning HTML5 The best book is "HTML5 Web page Development Example specific explanation", using code learning case study, can be more interesting than reading text!!!

A book to fix the HTML5, from now on start.

Free HTML5 serial to the "HTML5 Web development Example specific explanation" serial (v) illustrated by fiddler accelerated development