Fiddler using Tutorials

Tag: Represents the Type IP address compare doc javascrip htm src persistent

Brief introduction

Fiddler (Chinese name: violin) is an HTTP debugging agent, in the way of proxy server, listening system HTTP network data flow, Fiddler can also let you check all HTTP traffic, set breakpoints, and fiddle all "in and out" Data (which I typically use to grab packets), Fiddler also contains a simple yet powerful JScript-based. NET event scripting subsystem, which can support numerous HTTP debugging tasks.

Fiddler official website provides a lot of help documentation and video tutorials, which is the best information for learning fiddler

• Fiddler_ official website
• Fiddler_ Official documents
• Fiddler_ Official video
• Fiddler_ Official Plugin

How work works

Fiddler is in the form of a proxy Web server, the browser and the server through the establishment of a TCP connection to communicate with the HTTP protocol, the browser by default sends HTTP requests to the server, it uses proxy address: 127.0.0.1, Port: 8888. The agent is automatically set when Fiddler is turned on, and it automatically unregisters the agent when it exits, so that it does not affect other programs. However, if Fiddler exits abnormally, this is because Fiddler does not log off automatically, which can cause the webpage to be inaccessible. The workaround is to restart the next fiddler.

Main screen Main interface

The main interface of Fiddler is divided into Tools panel, conversation Panel, monitor Panel, status panel

Tool Panel Tools Panel

Description comment, re-request, delete session, continue execution, stream mode/buffer mode, decode, hold session, monitor specified process, find, save session, transduction, timing, open browser, clear IE cache, encode/Decode tool, eject Control monitor panel, MSDN, help

Two modes

• Buffer mode (buffering modes) fiddler the data back to the application until the HTTP response is complete. You can control the response and modify the response data. But sometimes the timing diagram is abnormal.
• Streaming mode (streaming mode) Fiddler immediately returns the HTTP response data to the application. Closer to real-world browser performance. Time series diagrams are more accurate, but do not control responses.

Session Panel Session Panel session Panel icon Monitoring Panel monitor Panel

• Statistical reports

1. Total requests, request packet size, response packet size.
2. Request start time, response end time, handshake time, wait time, route time, TCP/IP, transfer time.
3. HTTP status Code statistics.
4. Returns the size statistics of various types of data as well as pie chart presentation.

Statistical reports

• Time axis

Each network request undergoes a phase of domain name resolution, connection creation, sending requests, receiving data, and so on. A waterfall chart is formed by displaying multiple requests as a time as an X-axis, in the form of a chart. In fiddler, you can see the waterfall diagram of these requests as long as you select some requests on the left and the Timeline tab on the right.

Time axis

• A green request indicates that this is a "conditional request". The HTTP protocol defines 5 conditional request headers, the two most common being "if-modified-since" and "If-none-match". The server verifies that the local cache has expired based on these two headers, returns the latest version of the resource normally if it expires, or returns only 304 not Modified, and the browser continues to use the local cache. Requests containing conditional request headers are shown in green, otherwise black.

• A request with a shaded line is a request in buffered mode, and a solid is a request in streaming mode. Fiddler provides both buffer (buffering) and stream (streaming) capture modes: In buffered mode, Fiddler returns data to the application (usually the browser) when the response is complete, which can control the response and easily modify the response content; in streaming mode, Fiddler will return the response data to the browser in real time, but there is no way to control the response. The waterfall chart is more realistic when you use flow mode generally. Both of these modes can be selected through the Fiddler toolbar. In particular, the response returned by the "autoresponder" function of Fiddler can only be buffered mode.

• The different colors of the request bar correspond to different types of responses, categorized according to the MIME type of the response header. Light green indicates the response of the image type; dark green is JavaScript; purple is CSS; the others are blue.

• The black vertical line in the request represents the moment when the browser receives the first byte of the service-side response. This time is affected by the steps such as DNS parsing, establishing connections, sending requests, waiting for server-side responses, and so on.

• The icon following the request bar represents some of the characteristics of the response. The floppy disk icon indicates that the response body is obtained locally, which means that the server returns 304; Lightning indicates that this is the response of the Fiddler "autoresponder"; The downward arrow indicates that the response is 302 and needs to be redirected; The red exclamation point indicates that the request has occurred incorrectly (the status code is 4XX or 5XX). In particular, if there is a red X behind the request bar, the connection is disconnected after the server has responded to the request. There are two general possibilities for this: http/1.0 's response is not connection:keep-alive, or http/1.1 's response contains connection:close. The use of persistent connections eliminates the overhead of establishing a connection, and also reduces the impact of TCP slow start and other congestion control mechanisms, in short, with a lot of benefits.

• The red circle in front of the request indicates that the connection is new and the green representation is reused. The circle above represents the browser-to-Fiddler connection, and the following circle is the connection Fiddler to the server.

Status Panel Status panel

In the lower left corner of the console fiddler, there is a command-line tool called Quickexec, which allows you to enter commands directly.
Common commands are:

Command	explain
Help	Open the Official Use page introduction, all the commands will be listed to
Cls	Clear screen (Ctrl+x can also clear the screen)
Select	Select a command for a session
?. Png	Picture to select the PNG suffix
Bpu	Intercept request
Bpafter	Intercept response

Structure of the request message the structure of the request message response the structure of the message response common functions of the message structure

• Monitor HTTPS

Fiddler not only listens to HTTP requests but also captures HTTPS requests by default, and Fiddler option---HTTPS is set up under "Decrypt HTTPS traffic". If you do not have to listen to server-side certificate errors can be ticked "Ignore Server certification Errors", you can also skip a few designated host to narrow or expand the listening range.

Monitor HTTPS

• Host switch

HOST

• Simulate various scenarios

• Test performance with gzip compression

• Simulate agent testing to see if the server is customizing the response for different clients

• Simulate slow networks and test page fault tolerance

• Disable caching for easy debugging of some static files or test server response

• Customizing rules based on some scenarios

  
  Custom Rules

• Low-speed simulation sometimes for compatibility or performance optimization of a place, at low speed often can quickly find the problem is also easy to find the performance bottleneck, but other debugging tools did not provide low speed environment, and powerful fiddler considering this point, can be low-speed simulation set rules > Performance > Stimulate Modem Speeds.

• Compare (Contrast text)

  
  Compare Text

• Composer (constructor)

The request construct, as the name implies, is that we can simulate the request, which means that we can use Fiddler's composer to modify the parameter value in the request without altering the actual code of the development environment and to make a convenient recall of the request, and then compare the 2 request response to the specific difference. Any request parameter that has a corresponding response after a valid value is called again, the combination of any legitimate request you want can naturally be constructed as you wish, then called again and the return data is reviewed.

Paste_image.png

Drag the request left-click on the Fiddler to the right of the Request Builder tab and modify the original requested parameter Outputtype=json to OUTPU ttype=xml, then click on the Execute button to trigger the call request again

![Paste_Image.png](http://upload-images.jianshu.io/upload_images/947566-5aaac0b84a397c58.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

Double-click the request package under the Inspectors tab to view the return data as XML format, while the JSON format column is empty:

Paste_image.png

• Filters (Filter monitoring)

Grab a reload of the page, if the package has too many entries and you need to focus on a few items, you can use the Fiddler filter filters to grab the bag, then grab only the packets you want to catch. Switch to the Filters tab and tick the use filter to activate the filter so that the various filtering options below can be selected.

Filter_1

![Filter_2](http://upload-images.jianshu.io/upload_images/947566-b6ed61685e13315e.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

• Autoresponder (Request redirection)

The so-called request is nothing more than the need to invoke some of the resources (including JS, CSS and pictures, etc.), so-called redirection is the page needs to call the resources of other resources (you can control the resources or resources can be referenced).

1. You can make a copy of many or some of the resources of the foreground server locally, and if the resource has a bug in the normal network access environment that causes the development environment to crash, you can redirect the resource's request to the local copy so that you can continue to develop and debug your page, thus saving the waiting time of resource maintenance.
2. You can also maintain a number of people at the same time a JS file copy out of the local, when your development debugging received other people debugging code interference, you can redirect this JS call to the local non-interference JS file, non-interference development, function development completed and debug OK and then carefully integrate your code into the development environment, This will prevent others from interfering with your development of the module, that is, the ability to separate the JS file from the development environment without affecting the online debugging.
3. You can also point a style file or picture to Local.

![重定向](http://upload-images.jianshu.io/upload_images/947566-18f9c105596ef543.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

Mobile-side Grab Bag

Fiddler not only intercepts HTTP requests from various browsers, but also intercepts HTTP/HTTPS requests from various smartphones.
Fiddler can capture Ios,andriod,winphone, device-issued requests, and similarly, can intercept ipad, MacBook and other devices issued by Http/https.
The precondition is: Install Fiddler machine, with iphone in the same network, otherwise the iphone can't send http to fiddler machine.

The following are the steps:

• Fiddler settings Open Fiddler, tools-> Fiddler Options. (Remember to restart Fiddler when you are finished configuring).

• Select Allow remote computers to connect. is to allow other machines to send Http/https requests to fiddler APP

• Get the IP of the machine where the fiddler resides

• Install the Fiddler certificate This step is to allow Fiddler to capture HTTPS requests. If you only need to intercept HTTP requests, you can ignore this step

• The first thing to know is the IP address of the machine where Fiddler is located: if the IP address of the machine I installed fiddler is: 192.168.1.104 open iphone Safari, visit http://192.168.1.104:8888, point " Fiddlerroot Certificate "Then install the certificate
  

  App_1
  App_2

• Open the iphone, find your network connection, open the HTTP proxy, enter the IP address of the machine where the Fiddler is located (for example: 192.168.1.104), and the fiddler port number 8888 App_3

Resources

• Fiddler Tutorials

Daoyidao
Links: https://www.jianshu.com/p/99b6b4cd273c
Source: Pinterest
The copyright of the book is owned by the author, and any form of reprint should be contacted by the author for authorization and attribution.

Fiddler use Tutorial (GO)