How to *record* web Sessions for later analysis

README.md

How to record web Sessions for later analysis

There HAR file is a sort-of standard archive format for recording Web Session on an Archive for later analysis (performance comparison, etc).

The easiest way to generate a HAR file of a manual browsing session using Chrome or Firefox². In both cases there is a "Portable" Browser version, which can be very useful for the cases when workstation policies don't allow for installing plugins or extensions, and it's pretty straightforward to set up. Both options work fine, but it's marginally simpler (less hassle) to get it working in Chrome.

Saving Sessions on Chrome

Google Chrome Portable can be found in http://portableapps.com/apps/internet/google_chrome_portable

1. Open "Developer Tools"
2. In the "Network" tab, check the "Preserve Log" option to avoid the traffic being discarded on page reload/refresh. ![Preserve Log in Chrome Dev Tools][chrome-devtools-net-keepfullsession-2015-02-12_17-54-52]
3. Browse the site, to the relevant pages to get the traffic we want to work on.
4. To export, right click and choose -> "Save as HAR with Content" ![Save as HAR with Content][chrome-devtools-net-export-all-session-2015-02-12_17-56-56]

[chrome-devtools-net-keepfullsession-2015-02-12_17-54-52]: https://gist.github.com/jjarava/5f26806bba75d052c41a/raw/6d87d6feda5a452a2db33bbc2c2bfb85a28cecaa/Chrome-DevTools-Net-KeepFullSession-2015-02-12_17-54-52.jpg "Preserve Log in Chrome Dev Tools" width="848px" height="335px" [chrome-devtools-net-export-all-session-2015-02-12_17-56-56]: https://gist.github.com/jjarava/5f26806bba75d052c41a/raw/91a257dee6b5b2bd85dcf728b64fb862c5767f2f/Chrome-DevTools-Net-Export-All-Session-2015-02-12_17-56-56.jpg "Save as HAR with Content" width="820px" height="338px"

Saving Session on Firefox

Firefox Portable can be found in http://portableapps.com/apps/internet/firefox_portable

To be able to record navigation, it's necessary to install 2 extensions, Firebug and NetExport a FireBug extension¹ that allows exporting the session:

1. Install FireBug from http://getfirebug.com/
2. Install the Firebug extension called NetExport http://www.softwareishard.com/blog/netexport/ - On this page you can get info on the different ways of exporting data, etc...
   1. The download page is at http://getfirebug.com/releases/netexport/
   2. The latest version as of 2015-02-18 is 0.9b7 http://getfirebug.com/releases/netexport/netExport-0.9b7.xpi
3. Select the "Persist" button in the "Network" Tab in Firebug ![Persist Firebug Network Capture Across Page Reloads][firefox-firebug-persist-net-session-2015-02-12_18-05-46]
4. Browse the site, to the relevant pages to get the traffic we want to work on.
5. To export, in the drop-down menu labeled "Export" choose "Save As..." and select a name for the generated HAR file. ![Export FireBug Net Session][firefox-firebug-export-session-as-har-2015-02-12_18-05-46]

[firefox-firebug-persist-net-session-2015-02-12_18-05-46]: https://gist.github.com/jjarava/5f26806bba75d052c41a/raw/df5b3c3162ad24b6017731177f7fb62ebf4bdf41/Firefox-Firebug-Persist-Net-Session-2015-02-12_18-05-46.jpg "Persist Firebug Network Capture Across Page Reloads" width="853px" height="373px"

[firefox-firebug-export-session-as-har-2015-02-12_18-05-46]: https://gist.github.com/jjarava/5f26806bba75d052c41a/raw/4dec13f7005abbf35ce8e5beb9dbf8253b680124/Firefox-Firebug-Export-Session-as-HAR-2015-02-12_18-05-46.jpg "Export FireBug Net Session" width="840px" height="373px"

Consuming HAR files

The HAR files allow for analysis at a later time of the session(s) that have been recorded.

As to how to "visualise" the HAR files, below are some options (I haven't tested all of them):

HAR Viewer

Developed by the author of the NetExport extension to FireBug, it's the one I've found mentioned more often (and the one I tend to use):

• Tool Link: http://www.softwareishard.com/har/viewer
• Blog/Doc about the tool: http://www.softwareishard.com/blog/har-viewer
• Offline HAR Viewer: http://code.google.com/p/harviewer/

Other tools

• Chrome HAR Viewer
• Fiddler 2 - see instructions here: http://alertfox.com/using-fiddler2-instead-of-the-online-har-viewer/, more detail on Fiddler import/export options in this MSDN Blog Post
• PCAP Web Performance Analyzer
• Charles Proxy
• HTTPWatch

This is a field where there appears to be quite a lot of activity. This list is accurate to the best of my knowledge as of the time of writing (2015-02-18) but as always, Google is your friend!

¹: Yes, we're getting close to getting recursive here, with extensions of the extensions... 😄

²: There is a list of tools that generate HAR files available online at http://www.softwareishard.com/blog/har-adopters/; quite a lot of the "usual suspects" like Fiddler from v2.2.9.6+, IE 9 Developer Tools... There are even ways to convert a PCAP file to HAR

Chrome-DevTools-Net-Export-All-Session-2015-02-12_17-56-56.jpg

Chrome-DevTools-Net-KeepFullSession-2015-02-12_17-54-52.jpg

Firefox-Firebug-Export-Session-as-HAR-2015-02-12_18-05-46.jpg

Firefox-Firebug-Persist-Net-Session-2015-02-12_18-05-46.jpg

README.pdf