# Export HAR Files for Analyzing Client-Side Interactions

> Documentation for creating HAR files, and how they can be used for client-side diagnostics.

[HTTP Archive (HAR)](https://en.wikipedia.org/wiki/HAR_\(file_format\)) files are logs of network interactions made by a web browser. They contain headers, request bodies, response payloads, and even sensitive information like cookie values sent and received for each interaction.

Do not share sensitive information

Before sharing HAR files you should ensure they do not contain any sensitive information. You can sanitize a file by following the [steps below](#sanitize-a-har-file).

## When To Use A HAR File

[Section titled âWhen To Use A HAR Fileâ](#when-to-use-a-har-file)

Because HAR files are traces of all network interactions within the browser, they are commonly shared with another party to help diagnose issues. A common scenario is when there are multiple services involved with a use case. You can imagine an application where a user logs in to a site with Duende IdentityServer on the backend, and an external IdP storing the user account. That scenario has three distinct applications and the HAR file is used to trace if/when certain cookies are set within the login flow.

## HAR File Considerations

[Section titled âHAR File Considerationsâ](#har-file-considerations)

* Consider using an **incognito window** of your browser.
  * If you do, close all browser incognito instances you may have open and then open a new window to ensure the cache is cleared.
* Preserve the log across page navigation.
  * If you are navigating to different pages (ex: logging in to a site with OAuth redirects), then any network calls made before the last redirect will be lost. Preserving the logs across page navigation aids in diagnosing issues. The below steps include instructions to preserve network logs while navigating across multiple pages.
* Generate HAR files with sensitive data.
  * It is helpful to know that certain fields are have been set, but not necessarily the actual value. Some browsers will exclude sensitive data in HAR file exports by default. The below steps include instructions to enable sensitive data in HAR file exports for browsers that do not include it by default.

## Generating A HAR File

[Section titled âGenerating A HAR Fileâ](#generating-a-har-file)

Generating a HAR file involves steps using your web browser and its associated developer tools. The browser-specific steps outlined below are all similar to each other. Other browsers will have similar steps.

### Google Chrome

[Section titled âGoogle Chromeâ](#google-chrome)

1. Open the browser dev tools <https://developer.chrome.com/docs/devtools/open>.
2. In the dev tools, click on the Settings icon. Under the Network category, enable âAllow to generate HAR with sensitive dataâ.
3. In the dev tools, navigate to the Network tab and enable the âPreserve logâ checkbox.
4. In the browser, visit the page(s) and perform the steps that trigger the issue.
5. In the Network tab of the dev tools, click the down arrow and select the âExport HAR (with sensitive data)â¦â option to export the HAR file and save it locally.

### Safari

[Section titled âSafariâ](#safari)

1. Enable the Web Inspector, and open it <https://developer.apple.com/documentation/safari-developer-tools/enabling-developer-features>.
2. In the Web Inspector in the Developer menu, navigate to the Network tab. Click the âFilterâ button and enable âPreserve Logâ.
3. In the browser, visit the page(s) and perform the steps that trigger the issue.
4. In the Web Inspector, click âExportâ to export the HAR file and save it locally.

### Firefox

[Section titled âFirefoxâ](#firefox)

1. Open the browser dev tools <https://firefox-source-docs.mozilla.org/devtools-user>.
2. In the dev tools, navigate to the Network tab, click the Network Settings icon, and enable âPersist Logsâ.
3. In the browser, visit the page(s) and perform the steps that trigger the issue.
4. In the Network tab of the dev tools, click the Network Settings icon, and select âSave All As Harâ to save it locally.

### Microsoft Edge

[Section titled âMicrosoft Edgeâ](#microsoft-edge)

1. Open the browser dev tools <https://learn.microsoft.com/en-us/microsoft-edge/devtools/overview>.
2. In the dev tools, click on the ellipsis icon, then select âSettingsâ. Under the Network category, enable âAllow to generate HAR with sensitive dataâ.
3. In the dev tools, navigate to the Network tab and enable the âPreserve logâ checkbox.
4. In the browser, visit the page(s) and perform the steps that trigger the issue.
5. In the Network tab of the dev tools, click the down arrow and select the âExport HAR (with sensitive data)â¦â option to export the HAR file and save it locally.

## Viewing A HAR File

[Section titled âViewing A HAR Fileâ](#viewing-a-har-file)

HAR files are JSON files with a specific file extension. You can open one with any text editor you would normally open JSON files with. You can also import the HAR file into your browser dev tools to visualize it the same way you could see network interactions before exporting the file.

## Sanitize A HAR File

[Section titled âSanitize A HAR Fileâ](#sanitize-a-har-file)

Before sharing your HAR file with anyone, you should remove any sensitive data. You can do this manually by opening the HAR file with any JSON text editor and removing the sensitive data. We recommend replacing the data with a placeholder rather than deleting the entry. When diagnosing issues, itâs helpful to know whether a field was set.

## Practice

[Section titled âPracticeâ](#practice)

If you would like to practice with a small sample, you can login to the Duende Demo Server and generate a HAR file from those interactions.

1. In your browser, navigate to <https://demo.duendesoftware.com/Account/Login>.
2. With your browser and dev tools open, the log being preserved, and the ability to export a HAR file with sensitive data, login to the site using one of the built-in users.
3. Export the HAR file with sensitive data.
4. Explore the HAR file JSON with a text editor or import it into your browser dev tools.
-----