Articles on: FAQs

How to Create a HAR File for AfterShip Support Cases

Overview


A HAR file is a record of your browser’s network activity that helps diagnose website issues such as slow loading, errors, or missing resources. By using your browser’s Developer Tools to capture this activity and export it as a .har file, AfterShip support team and developers can have detailed information to identify and fix the problem quickly.


What you'll learn



What is a HAR file


  • HAR stands for HTTP Archive. It’s a JSON-formatted log capturing a web browser’s interactions with a web server (requests, responses, timings, data transfers, etc.).
  • It’s useful because it records all the network activity between your browser and a website, which helps in diagnosing loading issues, network errors, slow resources, missing files, or misbehaving scripts.


How to generate a HAR File


Here are the step-by-step instructions to create a HAR file using a standard browser like Chrome or Firefox.





  1. Open developer tools/ Network panel


  • In your browser, open the Developer Tools (often via F12 key or Ctrl+Shift+I / Cmd+Option+I).
  • Go to the Network tab.


  1. Enable logging/ Preserve logs


  • Ensure network logging is enabled (so that requests/responses will be captured).
  • (Optional but recommended) Check the option “Preserve log”. This ensures network history remains intact even if the page redirects or reloads.


  1. Clear previous logs (if any)


  • Before reproducing the issue or loading the page you want to inspect, clear any existing network logs, this helps you isolate relevant events. Click the no signal symbol to clear previous logs.


  1. Reproduce the issue and load the page


  • Navigate to the problematic page or reproduce the steps that cause the problem (e.g. click a button, load images/resources, trigger scripts, etc.).
  • Allow the page to fully load, and wait for any errors or delays to occur.


  1. Export or save the HAR file


  • In the Network panel, look for an option like “Export HAR”, “Save all as HAR”, or similar (the exact wording may differ between browsers).
  • Save the file (usually as .har) to your local machine.


  1. Share and analyze the HAR file


  • The saved HAR file can be shared with developers, support teams, or used in debugging tools to inspect all the network requests & responses.
  • You (or someone else) can open the HAR in a HAR viewer (many free tools online) like Google HAR Analyzer to examine resource loading times, errors, status codes, failed requests, redirects, etc.




When and why to use a HAR file


You should consider generating a HAR file when:


  • A website or a page isn’t loading properly, for example, the visitor is experiencing a blank page, half-loaded page, broken resources, etc.
  • Pages are loading very slowly. In this situation, HAR helps identify which resource(s) are causing the delay (large images, slow API calls, scripts, etc.).
  • You suspect requests are failing (404, 500, network errors). HAR logs show HTTP status codes and error details.
  • You're reporting an issue to developers or customer support, HAR gives them the complete context of the browser–server interaction, helping them debug more effectively.


Tips and best practices


  • Always clear existing logs before reproducing the issue. This avoids clutter and makes the HAR file easier to interpret.
  • Use “Preserve log” option if the issue involves navigation, redirects, or page transitions.
  • Try to reproduce the issue as closely as possible while logging actions like clicking, scrolling, or waiting for delays, so the HAR captures all relevant events.
  • When sharing HAR with others, avoid exposing personal or sensitive data (cookies, authentication tokens, private user data), treat the HAR like a log of everything your browser sends/receives.
  • Use a dedicated HAR viewer or network-analysis tool to open and inspect the HAR, raw JSON may be hard to parse manually.


How to edit the HAR file and console logs for security purposes


Complete the following steps:


  1. Open the file in a text editor application.
  2. Use the text editor's Find and Replace tools to identify and replace all sensitive information in the file. Also, make sure to remove or mask cookies and authentication headers.


Note: You can replace sensitive information with a generic string, such as "REDACTED_DUE_TO_SECURITY."


  1. Save the edited file and repeat these instructions for the next file.





Who this helps


  • Web developers / QA testers: when debugging front-end, server communication or network-related issues.
  • Support / customer-support teams: when a user reports a broken or slow website; asking for a HAR file can expedite diagnosis.
  • Advanced users / power users: wanting to analyze what happens behind the scenes when a page loads (resources, redirects, APIs, etc.).




Updated on: 04/12/2025