Analyzing Requests with Fiddler
For developers, it is one of the most annoying situations when they are receiving incorrect data. On top, you don’t know where the problem lies – whether in your application or backend services. It is so frustrating that you just wish to hack your own application. So, to save front-end developers from becoming hackers, debugging tools like Fiddler can help inspect traffic from their applications.
What is Fiddler?
Fiddler is a web debugging proxy with the facility to log entire HTTP traffic in between your server and machine. It facilitates frontend developers to analyze the HTTP requests in the raw format and shows all the incoming and outgoing requests. This debugging proxy can furthermore help in performance testing, security testing, session manipulation and can be trained to act as a reverse proxy to analyze traffic between the web and your multiple devices. It is basically a tool to know what your device is receiving or sending it to the web.
Fiddler Installation Process
It is a one-tap process to download Fiddler; you just have to open the following link in your web browser - https://www.telerik.com/download/fiddler. You have to fill a form, get the license, and complete the download and installation process.
Fiddler Configuration Setup
When you execute Fiddler for the first time, it will pop up the WinConfig window ahead of you. Don’t worry about it and close it for now. Next, you have to enable logging for HTTPS traffic. Fiddler won’t allow logging settings to automatically because it requires root certificate trust. Thus, you can ignore HTTPS traffic till then, but to allow you have to:
- Click on Tools menu and then Options.
- Up next, click on the HTTPS tab.
- Just check on the Decrypt HTTPS traffic box.
After clicking on the traffic box, you will receive a pop-up window on your screen asking whether you trust the Fiddler Root Certificate or not. If you trust, click on ‘Yes,’ otherwise on ‘No.’ If you don’t trust the Fiddler decrypts HTTPS sessions by clicking on Yes, it will not work for you.
Once you have clicked ‘Yes’ to all the pop-up windows following up related to the certificate, you will enter into a section named Protocols on the HTTPS tab. There you have to click on the existing protocols and append tls1.1;tls1.2;
. It will also optimal windows for now that you might need to configure later on, but for now, you are all sorted.
Fiddler Debugging Proxy
This guide will show you how you can analyze HTTP requests with Fiddler on the three leading Operating Systems – Windows, iOS, and Android.
Analyzing Requests with Fiddler on Windows
Once Fiddler runs on your Windows, you can effortlessly run an UWP project within Visual Studio, and debugging will start without further configuration. However, in some situations, you need to ensure that the application is exempted from the list so that traffic can be easily routed to the local machine. To confirm that, click on the WinConfig button.
On the top right corner of Fiddler you'll see an icon with status Online. If your hover over that icon you will see information about the Fiddler Proxy IP. Open a browser and add the default port 8888 to check the Fiddler Echo Service.
While configuring the HTTPS traffic decryption, you have to install and trust the Fiddler root certificate because without accepting prompts, you can’t run Fiddler on Windows. Moreover, if you are trying to run the Windows application on your other devices, even then, you have to install and trust the root certificate. By clicking on the FiddlerRoot certificate and trusting it on your Local Machine, you are ready to analyze traffic requests on your Windows.
Analyzing Requests with Fiddler on iOS
In the case of the iOS operating system, you have to use the iOS simulator. The same process will work with all the iOS devices, running on the same local network as the iOS device running Fiddler. Within two steps Fiddler will be ready to debug on your iOS devices
Install and Trust the Root Certificate – You have to load the Fiddler echo page by entering http:[ipaddress]:[port] (eg http://192.168.1.164:8888).
Next, click on the Fiddler certificate link and follow the prompts to download. Apart from downloading, you have to install a certificate also. For that, got to Settings > General > Profile > FiddlerRoot Profile. Now, you have to trust the Fiddler root certificate by following command line – Settings > About > Certificate Trust Settings > Shift toggle in front of the FiddlerRoot Certificate.
Set up HTTP Proxy - To configure simulator, you first have to launch the iOS app from Visual Studio. When the simulator is running, stop the debugging process and set up the simulator for traffic debugging.
If you are using a physical device, simply go to your network settings and edit your current Wi-Fi connection. Go to the section HTTP PROXY and open Configure Proxy. In the following screen set it to Manual and add your Fiddler Debugger proxy IP and port. In our example 192.168.1.164 and 8888. Save it.
Now you will see all your devices traffic flowing in Fiddler.
Analyzing Requests with Fiddler on Android
For Android, you can use an Android simulator or real device as per your convenience. However, the Fiddler process is quite different on Android. In Android, you have to use a proxy in your code using the following code:
var handler = new HttpClientHandler();
handler.Proxy = new WebProxy("192.168.1.164", 8888);
var client = new HttpClient(handler);
The little thing about this code is that “it will work.” You don’t have to trust the Fiddler root certificate, which raises numerous security-related concerns. Moreover, the application isn’t configured by the user.
You might not be able to use HttpClientHandler with the code. However, by changing the code slightly, you can quickly fix that:
protected override async void OnCreate(Bundle savedInstanceState) {
...
var handler = new AndroidClientHandler();
handler.Proxy = new WebProxy("192.168.1.164", 8888);
var client = new HttpClient(handler);
var users = await client.GetStringAsync("https://reqres.in/api/users?page=0");
System.Diagnostics.Debug.WriteLine(users);
}
You will see a similar SSL handshake, which means you have to install the Fiddler root certificate and configure your application. For that you have to navigate - http:[ipaddress]:[port] (eg http://192.168.1.164:8888). Then, click on the root certificate link and follow all the upcoming prompts to complete the installation process.
You can inspect installation by following to Settings > Security and Location > Encryption & Credentials > User Credentials. Once certificate is installed, you have to configure your Android project to allow the utilization of a certificate from the user store.
Get Started
With the simple downloading, installing, and trusting Fiddler root certificate, you are all set to analyze all the HTTP requests send or received by your device. It doesn’t matter whether you are creating iOS, Windows, or Android applications; you can secure your frontend side with the Fiddler. So, when your data gives you trouble, go to the Fiddler, or you can share it with us in the comments.