Debugging Your Application with Fiddler
What is Fiddler?
In their own words:
Fiddler is a Web Debugging Proxy which logs all HTTP(S) traffic between your computer and the Internet. Fiddler allows you to inspect traffic, set breakpoints, and "fiddle" with incoming or outgoing data. Fiddler includes a powerful event-based scripting subsystem, and can be extended using any .NET language.
Fiddler is freeware and can debug traffic from virtually any application that supports a proxy, including Internet Explorer, Google Chrome, Apple Safari, Mozilla Firefox, Opera, and thousands more. You can also debug traffic from popular devices like Windows Phone, iPod/iPad, and others."
Fiddler is one of the many tools available that you can use as a proxy server. It is popular, free and relatively easy to use. Not only are you able to inspect HTTP traffic, but you can also construct and execute your own HTTP requests. Fiddler can be downloaded here:
There are several Fiddler settings that you might want to configure after installing Fiddler:
- Allow remote computers to connect – Allows remote clients to route traffic through Fiddler. If you want to use fiddler on your machine as a proxy between your mobile device and Verivo AppServer, you need to enable this setting (it’s disabled by default):
- Decrypt HTTPS traffic – Allows to decrypt and read HTTPS traffic in a plain text:
- Capture Traffic – toggles between capturing all WinINET (all windows HTTP(S)) traffic and only the traffic that was specifically routed through Fiddler (by configuring HTTP proxy). It is enabled by default, so you’ll see a lot of noise coming from your machine’s browsers/browser’s plugins unless you turn it off:
Enabling Fiddler debugging
To enable Fiddler debugging, you must first have Fiddler installed, and be hosting the website on the machine Fiddler is running on. You configure Fiddler as a system proxy, so Fiddler must be open for network traffic to resolve successfully.
To configure Fiddler:
- Open Fiddler, go to Tools, then Fiddler Options.
- On the Connections tab, check the box marked Act as system proxy on startup.
- Restart your computer to ensure the proxy is properly enabled.
Configuring Proxy Server on the Client OS
You can enable a proxy server in your internet (LAN/Wi-Fi) connection settings. Here is how you can configure this setup through the clients listed below:
In this section clients are configured using an HTTP proxy server that is running on server.test.com and listens to the port 8889
You should not use these settings. Instead use the name (or the IP address) of the machine where you run the HTTP proxy. Also, the default port for
most of the HTTP proxies is 8888 (not 8889)
iOS: The most “proxy-friendly” mobile client and has the easiest configuration required to enable proxy for a Wi-Fi connection. To change proxy settings on an iOS device, go to Settings -> Wi-Fi.
Then click on the white/blue arrow for a Wi-Fi network->choose Manual for HTTP Proxy and enter your proxy server details
BlackBerry: For BlackBerry simulators you can enable a proxy server through the MDS simulator config. You need to modify MDS rimpublic.property config file (similar to how you change MaxNumberOfKBytesToSend). Under the [HTTP HANDLER] section, add the following lines:
application.handler.http.proxyEnabled = true
application.handler.http.proxyHost = *hostname*
application.handler.http.proxyPort = *port*
Android: Android only supports the proxy server with Verivo applications starting from the 4.0 release.
To configure proxy server go to Settings -> Wi-Fi.
Select the WiFi network and do a long tap.
Choose Modify Network and then select the box show advanced options.
Select Proxy settings (change to Manual) and insert server name and port:
Using Fiddler with AppStudio
AppStudio supports using third-party HTTP proxy servers such as Fiddler. HTTP proxy servers let you view all the HTTP traffic coming and going from your machine. This is useful for debugging plug-ins that use web services because you can view the communication between the device or simulator and the back-end data source.
HTTP proxies work with plug-ins that use HTTP-based web services, such as the WSDL, WCF, and REST plug-ins. It does not work with plug-ins like SQL Server.
When configuring the proxy, be sure to allow remote computers to connect to the proxy. This lets you view the traffic between your mobile device (including simulators) and Verivo AppServer. Also, be sure to enable HTTPS traffic if your app uses secure connections to the web services.
To use a proxy with AppStudio:
- Open the Data Source Manager.
- Under Connection Settings, select the Proxy Settings tab:
If you do not see a Proxy Settings tab, then your plug-in does not support proxy servers.
- Enter the following information in the fields:
(Required) Enter the proxy URL. This will typically be your machine name and a unique port such as 8888. This port must match the port that your proxy server is listening on and must not be used by any other services.
(Optional) Enter your user name if the proxy server requires one.
(Optional) Enter your password if the proxy server requires one.
If you just added the proxy information, before you run your app on a device or in a simulator, be sure to reload the configuration.
If the proxy is configured correctly, then you should be able to view outbound requests and inbound responses between your machine and the remote data source.
Analyzing a request to a data source
Once you're successfully capturing the data source requests, you need to be able to analyze them in Fiddler. In the main Fiddler window, you should have a list of incoming and outgoing requests in the left-hand pane. Search for the host you're attempting to connect to with the application's service call.
The right panes have a number of options for examining the calls and the responses. Generally, you'll want to use the Raw view in the bottom pane to get the most detail about the response from the server. You can also view the Raw request by clicking on the yellow Raw hyperlink in the top right of the top pane.