HAR Viewer

A HAR viewer is a developer tool that opens an HTTP Archive (.har) file and renders every captured request as a searchable, filterable timeline of network activity. A HAR file is a JSON document standardized by the W3C Web Performance Working Group (HAR 1.2 spec) that browsers export from their DevTools Network panel, and it records the URL, method, status, headers, timing, request body, and response body for every resource loaded by a page.

This HAR viewer accepts a dropped .har file, parses the log.entries array client-side, and shows a row per request with status, method, path, and duration. QA engineers, backend developers, and performance specialists open HAR files when a bug only reproduces on someone else’s machine or when a third-party API misbehaves.

Why use a HAR viewer?

• Read large HAR files without DevTools. Heavy SPA archives can crash the original DevTools panel on reopen. The viewer keeps even 10 MB files responsive.
• Filter to the request that broke the flow. Combine the URL search with method and status dropdowns to isolate a 4xx or 5xx call in seconds.
• Surface slow requests automatically. Any entry over 500 ms is flagged with an amber border and counted in the header.
• Inspect headers and bodies inline. Click any row to expand request headers, response headers, request body, and the first 10 KB of the response body.
• Share repros without re-exporting. Attach a HAR to a bug ticket once and any teammate can replay it.

How to use the HAR Viewer

1. Open your browser’s DevTools Network panel, reproduce the issue, and right-click any row to choose Save all as HAR with content.
2. Drag the resulting .har file onto the drop zone, or click to browse and select it.
3. Type a substring of a URL into the Filter by URL input to narrow the list.
4. Use the All methods and All statuses dropdowns to scope the view to a specific verb or response class. Pick Slow (>500ms) to see only entries that exceeded the timing threshold.
5. Click a row to expand it and inspect request headers, response headers, request body, and the truncated response body.

HAR file structure

A HAR file is a single JSON object with a log root that holds version metadata, the user-agent that captured the file, optional pages, and the entries array that the viewer reads. Each entry is a self-contained record of one HTTP transaction.

{
  "log": {
    "version": "1.2",
    "creator": { "name": "Firefox", "version": "121.0" },
    "entries": [
      {
        "startedDateTime": "2026-05-17T10:21:04.512Z",
        "time": 287,
        "request": { "method": "GET", "url": "https://api.example.com/v1/users" },
        "response": { "status": 200, "statusText": "OK" },
        "timings": { "wait": 184, "receive": 12 }
      }
    ]
  }
}

Field reference table

The viewer surfaces the most useful HAR 1.2 fields. Use the table below to map what you see in the UI back to the spec.

Common use cases

• QA engineers triaging “works on my machine” bugs. Ask the reporter to export a HAR, then replay the failing request locally.
• Backend developers debugging third-party API failures. Spot a 502 from a payment provider buried in dozens of analytics calls.
• Performance engineers auditing Core Web Vitals regressions. Filter by slow requests to find render-blocking scripts.
• Support engineers attaching reproductions to tickets. Bundle a HAR with a screenshot for a complete network-level repro.

Frequently asked questions

What is a HAR file used for?

A HAR file captures every HTTP request a browser made during a session: URL, headers, body, timing, and response. Teams use it to reproduce bugs across machines and audit page load performance.

How do I export a HAR file from Chrome?

Open DevTools, switch to the Network panel, reproduce the issue, then right-click any row and choose Save all as HAR with content.

Does this HAR viewer upload my file anywhere?

No. The file is parsed in your browser with JSON.parse. Request bodies, response bodies, cookies, and authorization headers never leave your device.

What is the maximum HAR file size I can open?

Roughly 50 MB on a modern laptop. Beyond that the JSON parse step can freeze the tab. Filter the request set in DevTools before exporting for very large captures.

Why does my HAR file show no response bodies?

DevTools omits bodies unless you pick Save all as HAR with content instead of the default. Re-export with that option and the response previews appear.

Can I edit a HAR file in this viewer?

No. The viewer is read-only since editing risks invalidating timing data. To redact secrets, open the JSON in a text editor before sharing.

What is the difference between HAR and a screenshot?

A screenshot captures what the user saw. A HAR captures what the browser fetched. ShotMark bundles both automatically with every capture.

Related tools

• User-Agent Parser: Decode any browser User-Agent string into browser, OS, and engine.
• Browser Info: Show your current browser, OS, language, and hardware details.
• Browser Size: Live readout of viewport and screen dimensions for responsive QA.
• URL Parser: Break any URL into scheme, host, path, query, and fragment.