Debugging with Fiddler

6,365 views

Published on

How to use Fiddler to inspect traffic, investigate performance of web applications and services, debug web applications, test applications, and support client issues.

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
6,365
On SlideShare
0
From Embeds
0
Number of Embeds
603
Actions
Shares
0
Downloads
194
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Debugging with Fiddler

  1. 1. Ido Flatow Senior Architect Microsoft MVP SELA Group Debugging the Web with Fiddler @idoFLATOW http://bit.ly/flatow-blog This presentation: http://sdrv.ms/13mgEP9
  2. 2. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER MEET FIDDLER…
  3. 3. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER MEET FIDDLER…
  4. 4. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER MEET FIDDLER…
  5. 5. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER Application Network APIs Proxy Website WHAT IS FIDDLER?
  6. 6. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER HOW FIDDLER WORKS… Internet Explorer WinINET Office CryptoAPI WinHTTP Fiddler Firefox Upstream Proxy Web Site Firewall
  7. 7. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER FIDDLER FACTS  A proxy server  An HTTP/HTTPS Sniffer  An HTTP Debugger  Written in .NET 3.5 / 4  A free utility (for now, cross your fingers)  An extensible application  A must tool for web developers  Unfortunately, it doesn’t make coffee!
  8. 8. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER SCENARIO: INSPECTING TRAFFIC  Web sessions  Inspectors  Filters  QuickExec
  9. 9. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER THE SESSIONS LIST 9 Sequence and color coding Caching information Origin process Manual commentsResponse size
  10. 10. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER FIDDLER TO THE RESCUE  Browsers (Static sites, ASP.NET, J2EE, PHP)  Desktop applications that use HTTP  Web services  Windows Phone Emulator  Any device that supports a proxy server ( )
  11. 11. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER THE RIGHT INSPECTOR FOR THE JOB
  12. 12. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER FILTER BY… By process type By specific process By host By process name/PID/svchost By URL By status code By MIME or size QuickExec
  13. 13. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER FIDDLER AND HTTPS  HTTPS is secured - between two machines  Fiddler acts as a “machine-in-the-middle”  Generates certificates for web sites on-the-fly  Fiddler supports client certificates for authentication  Supports excluding problematic HTTPS sites
  14. 14. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER IF YOU SEE THIS, DON’T PANIC
  15. 15. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER SCENARIO: PERFORMANCE TUNING  Timeline  Statistics  More inspectors
  16. 16. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER REMINDER UNDERSTANDING THE CONNECTION Application Network APIs Proxy Website Second connection From Fiddler to the server First connection From client to Fiddler
  17. 17. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER VISUALIZE THE TRAFFIC WITH TIMELINE Start End Bar color = MIME Red = new connection Green = reused connection Disk = cached response Bar = begin receive Stripes = buffered by Fiddler Prefer stream over buffer Use buffer when editing responses
  18. 18. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER STATISTICS ARE IMPORTANT  Single page statistics give info on performance  Client processing  Server processing  Network latency  Server time: ServerBeginResponse – ServerGotRequest  Upload time: ServerGotRequest – ClientDoneRequest  Download time: ServerDoneResponse – ServerBeginResponse  Watch out for misleading connection reuse
  19. 19. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER DRAWING CONCLUSIONS  Reduce number of requests  Reduce traffic roundtrips  Reduce the size of requests and responses  Applying compression where needed  Identify non-cached responses  Use Fiddler to improve performance, not to measure it!
  20. 20. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER SCENARIO: DEBUGGING  Replay  Composer  Breakpoints
  21. 21. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER PLAY IT AGAIN, SAM  Why run the client scenario again, just to resend the request?  Simply click “Replay”  Reissue a single request  Reissue a set of requests  Reissue unconditionally (no cache headers)  Reissue multiple times
  22. 22. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER CHANGING REQUESTS WITH COMPOSER  Create any request from scratch  Use previous requests with drag-n-drop  Don’t bother calculating content length www.bobthebuilder.com
  23. 23. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER DEBUGGING LOCALHOST  In some cases, proxies are bypassed when using localhost (127.0.0.1) addresses  What to do?  Use the machine’s name  Use fictitious DNS names  ipv4.fiddler or ipv6.fiddler (converted to 127.0.0.1 / [::1])  localhost. or localhost.fiddler (converted to localhost)  Force the use of a proxy with netsh
  24. 24. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER SCENARIO: TESTING  Save / Export  Auto responder
  25. 25. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER WHAT DID YOU TYPE IN WRONG TO GET IT TO CRASH?  Save traffic to file  Save sessions as .SAZ (Zip) archive  .SAZ stores content and session info  Other archiving options:  HTTP Archive (HAR)  Visual Studio Web Test
  26. 26. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER AUTO-RESPONDER AN IN-MEMORY WEBSITE  If URI matches… then respond with…  Respond with file/redirection/breakpoint/drop  Not only that, you can also:  Import sessions as responses  Edit stored responses  Use original latency time (updatable)  Export and import rules
  27. 27. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER SCENARIO: CUSTOMERS  Reverse proxy  Fiddler Cap
  28. 28. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER CAN’T FIDDLE THE CLIENT? FIDDLE THE SERVER Local Network Web ServerFiddler 8180 http://bit.ly/fiddler-reverse-proxy
  29. 29. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER MINI FIDDLER, CUSTOMER-ORIENTED  Six simple steps  Install and run  Click 1. Start Capture  Browse the web site  [Take some screenshots]  Click 2. Stop Capture  Click 3. Save Capture  Email me the .SAZ file 29
  30. 30. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER EXTENDING FIDDLER  Customize rules script  Create custom inspectors  Create requests and responses auto-modifiers  Create new exporter/importer  Extend QuickExec with new commands  Add menus and tabs
  31. 31. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER FIDDLER IS MORE THAN A SNIFFER  Monitors traffic, yes, but also…  Controls traffic  Modifies traffic  Generates traffic  Easy to use  Extensible
  32. 32. www.devconnections.com DEBUGGING THE WEB WITH FIDDLER http://bit.ly/flatowblog @IdoFlatow idof@sela.co.il My Info Fiddler Website http://www.fiddler2.com http://groups.google.com/group/httpfiddler Fiddler Forum http://www.telerik.com/automated-testing-tools/blog/eric-lawrence.aspx http://blogs.msdn.com/b/fiddler (older blog) Fiddler Blog http://sdrv.ms/13mgEP9 This Presentation RESOURCES

×