When troubleshooting web application issues, generating a HAR (HTTP Archive) file can be extremely useful. A HAR file records the interactions between a web browser and a site, providing detailed performance data and revealing any issues that may be occurring. Here’s how you can generate a HAR file in different browsers:
Google Chrome
- Open Google Chrome and go to the page where you are experiencing issues.
- Open the Developer Tools by pressing
F12orCtrl+Shift+I(Windows/Linux) orCmd+Option+I(Mac). - Go to the Network tab.
- Ensure the Preserve log option is checked to capture the requests.
- Click the grey crossed circle button to clear any existing logs from the network tab.
- Click the Record button (red circle) if it is not already recording.
- Refresh the page to start reproducing the issue while network requests are being recorded.
- Once the issue has been reproduced, click the download button, Export HAR, to download, and save the file to your computer: Save as HAR with Content.
- Save the HAR file to your computer.
- Attach the file to your email so our team can further investigate.
The instructions are the same for a MAC computer or a Windows computer. Find below a brief animation with the steps to retrieve a HAR file in Chrome.
For any issues generating this file, see this article from Google's Help Center: Capture web session traffic.
If you generate an empty HAR file, see the Why are exported Chrome HAR files returning zero bytes? troubleshooting article. You may need to enable HAR exports with sensitive data.
To retrieve console logs in Chrome
- Open Main Menu for Chrome.
- Navigate to More Tools > Developer Tools.
- Open the Console tab and screenshot any errors that appear.
Mozilla Firefox
- Open Firefox and go to the page where the issue is occurring.
- Open the Network Monitor.
- Reproduce the issue while the network requests are recorded.
Right-click anywhere under the File column and click Save All As HAR
- Save the HAR file to your computer.
- Attach the file to your email so our team can further investigate.
The instructions are the same for a MAC computer or a Windows computer.
To retrieve console logs in Firefox
- In the Tools menu, select Web Developer.
- Console logs will appear in a separate window.
- Screenshot any errors that appear.
Microsoft Edge
- Open Microsoft Edge and go to the page where you are experiencing issues.
- Open the Developer Tools by pressing
F12orCtrl+Shift+I(Windows/Linux) orCmd+Option+I(Mac). - Go to the Network tab.
- Ensure the Preserve log option is checked to capture the requests.
- Click the Record button (red circle) if it is not already recording.
- Refresh the page to start capturing the network requests.
- Once the issue has been reproduced, right-click on any network request and select Save all as HAR with content.
- Save the HAR file to your computer.
- Attach the file to your email so our team can further investigate.
Safari
- Open Safari and go to the Develop menu. If you don't see theDevelop menu, follow the instructions in this article from the Safari User Guide: Use the developer tools in the Develop menu in Safari on Mac.
- Select Show Web Inspector.
- Click the Network tab. You must keep it open while you reproduce the issue.
- Reproduce the issue while the network requests are recorded.
- Click the Export icon and save the HAR file.
- Save the HAR file to your computer.
- Attach the file to your email so our team can further investigate.
For any issues generating a HAR file in Safari, see this article from Safari Developer website: Web Inspector.
To retrieve console logs in Safari
- Open Preferences and navigate to the Advanced tab.
- Select Show Developer menu in the menu bar.
- Close Preferences.
- In the menu bar, select Developer > Show error console.
- Screenshot any errors that appear.
By following these steps, you can generate a HAR file that can be shared with support teams to help diagnose and resolve web application issues more effectively.