When we work with Web API, most of the time we need to see the request going to the server and the response coming back from server. Also some times, we need to modify or create a Web API request and check the response got back from server.
Fiddler is a nice tool which can help us in making a Web API request and inspecting respective responses. Now a days, all modern browsers also contain ability to capture and inspect the response/ HTTP traffic.
First of all install Fiddler, if you not have this installed.
Get it from here: http://www.telerik.com/download/fiddler
Fiddler is a web debugging proxy. With Fiddler we can capture and analyze the HTTP/ HTTPS traffic. It also has feature to create complete request with headers and send it over web(HTTP/ HTTPS) and analyze the returned response. Without a debugging tool like Fiddler, its very hard to develop a Web API.
Lets open Fiddler now. We will see, the left side pane contains different request which is getting captured. Now if we do a request to our web api, then we will see that the requested url got captured and listed out there.
I setup a site on my local as http://sample.dev
And i call the api in browser(Internet Explorer): http://sample.dev/api/teams/100
FYI: My site is pointing to the application, we created in previous article.
Note: When Fiddler is launched, it registers itself as the system proxy. So, requests from the applications that use WinInet such as Internet Explorer are automatically intercepted by Fiddler. It can be registered for other browsers too.
Now in Fiddler, select the request under left pane and select Inspectors tab in right side pane. We will notice, there are 2 boxes; Top one will contain the data sent to the API and bottom box will contain the response data. Here we can choose different format of data we want to see, Like, i selected JSON tab.
Here we can notice the json data returned from our web api.
Composing request from Fiddler
Ok. Till now we captured request processed through browser. Let's now compose and process a request directly from Fiddler.
Let's create a post request for creating a new team. Go to the Composer tab in Fiddler right pane. We see 2 boxes under Parsed tab; Top one for header and bottom one for requested body part. We will put our new team details in bottom part. See the below image for reference.
Now enter the web api url and select post and hit Execute button.
Let's see the response of this call now. Click on Inspectors tab and select JSON tab. We will see the newly added team details in bottom tab there. Like below image:
So, above details was checking request/ response through Fiddler.
Analyzing request/ response through browser
As mentioned above, we can also use a browser for capturing request and response. Let's see how. I will use Firefox in below example.
- Open Firefox and press F12, to open Firebug(or web developer tool).
- Do a get request through url here. I will use: http://sample.dev/api/teams/100
- Now go to Net(which analyzes network traffic) tab in Firebug. Under that click on All.
- There we can notice/ analyze request and response details. See below images for more details.
Stay tuned, if looks interesting.
Book: Practical ASP.NET Web API [Apress]