How to generate a HAR file

[Dyna_Patrick]

Abstract

This article provides information on what a HAR file is and how to generate one. It covers Google Chrome, Microsoft Edge, and Mozilla Firefox (to get a HAR file for Mobile Application with a webview, see this article).

What is a HAR File? 

A HAR (HTTP Archive) file is a log of all network requests made by a web page in your web browser. It includes details about each request, such as the URL, response headers, request headers, and timings.

A HAR file is a useful troubleshooting tool because it provides a comprehensive snapshot of a web page's network activity, allowing for precise issue identification.

How to generate a HAR File 

Chrome and Edge

Step 1: Open the Developer Tools

Open Developer Tools using one of the options below:

• Open the Browser and press F12 on your keyboard, or
• Right-click anywhere on the page and select "Inspect" or "Inspect Element", or
• On Chrome, you can also use the three-dot menu in the top-right corner of the browser > More tools > Developer tools.

 

Step 2: Check Preserve log checkbox

1. In Developer Tools, click on the "Network" tab. 
2. Ensure the "Preserve log" checkbox is checked.
   This option keeps the network log intact even after a page refresh or navigation.
3. Optionally, you can clear the network log by clicking the "Clear" button. ∅  

Chrome and Edge: 

Step 3: Generate traffic

To capture all network activity on the webpage, you'll need to reload the page or perform the specific actions that trigger the network requests you're interested in (e.g., submitting a form, clicking a link, etc.).

Note: the actions must be completed in the same tab as Developer Tools is open in for the traffic to be recorded

Step 4: Stop Recording

1. Once you've captured the network activity you need, return to the "Network" tab in Developer Tools. You should see a list of network requests made by the webpage.
2. Click the red "Stop" button (square icon) in the top-left corner of the "Network" tab to stop recording network activity. 
    

Step 5: Export the HAR File

Export the HAR file using one of the methods below:

1. In Network Requests
   1. Right-click anywhere in the list of network requests.
   2. Select Copy >  "Copy All as HAR (sanitized)".
   3. Choose a location on your computer to save the HAR file, give it a descriptive name, and click "Save."
      or
2. From Network settings bar
   1. Click "Export HAR (sanitized)"
   2. Choose a location on your computer to save the HAR file, give it a descriptive name, and click "Save."
      
      

Firefox

Step 1: Open Network Monitor

Open Network Monitor (Web Developer Tools, Network tab) using one of the options below:

• Open the Browser
  • and press CTRL + SHFT + E on your keyboard, or

  • and select Tools > Web Developer > Web Developer Tools. Then,  select the "Network" tab

Step 2: Persist Logs

1. Ensure the "Persist logs" checkbox is checked.
   This option keeps the network log intact even after a page refresh or navigation.
2. Optionally, you can clear the network log by clicking the bin icon   

Step 3: Generate Traffic

To capture all network activity on the webpage, you'll need to reload the page or perform the specific actions that trigger the network requests you're interested in (e.g., submitting a form, clicking a link, etc.).

Note: the actions must be completed in the same tab as Web Developer Tools is open in for the traffic to be recorded

Step 4: Stop Recording

Once you've captured the network activity you need, return to the "Network" tab in Web Developer Tools. You should see a list of network requests made by the webpage.

1. Click the "pause" button, | | , to stop recording network activity. 

Step 5: Export the HAR File

Export the HAR file using one of the methods below:

1. In Network Requests
   1. Right-click anywhere in the list of network requests.
   2. Select "Save All As HAR".
   3. Choose a location on your computer to save the HAR file, give it a descriptive name, and click "Save."
      or
2. From Network settings bar
   1. Click "HAR"
   2. Select "Save All As HAR".
   3. Choose a location on your computer to save the HAR file, give it a descriptive name, and click "Save."

Useful Links

How to get HAR files for webviews?

How to enable dtHealthCheck

[HannahM]

Great write up. Really helpful info. Thanks Patrick. 

[radek_jasinski]

Great 🙂 Thank you !