Star us on GitHub

Recording Network Requests and Responses

Highlight out of the box shows you all the network requests durations, response codes, and sizes for a session. If you'd like more data such as the headers and bodies, you can enable recording of network requests and responses by setting networkRecording.recordHeadersAndBody (see NetworkRecordingOptions) to true when initializing Highlight.

Highlight monkey patches XmlHttpRequest and fetch to record data from your app's requests/responses including status codes, headers, and bodies.


Out of the box, Highlight will not record known headers that contain secrets. Those headers are: - Authorization - Cookie - Proxy-Authorization

If you have other headers that you would like to redact then you can set networkRecording.networkHeadersToRedact.

Recording Headers and Bodies

Highlight can also record the request/response headers and bodies. You'll be able to see the headers and bodies by clicking on any XHR or Fetch requests in the session Developer Tools.

H.init('<YOUR_PROJECT_ID>', { networkRecording: { enabled: true, recordHeadersAndBody: true, }, })

Redacting URLs

You may have APIs that you know will always return secrets in the headers, body, or both. In this case, you can choose URLs to redact from. If a URL matches one of the URLs you specify, the header and body will not be recorded.

H.init('<YOUR_PROJECT_ID>', { networkRecording: true, urlBlocklist: [ '', '', '', ], })

Out of the box, Highlight will not record these URLs: - -

Redacting Headers and Bodies

If you are dealing with sensitive data or want to go the allowlist approach then you can configure networkRecording.headerKeysToRecord and networkRecording.bodyKeysToRecord. Using these 2 configs, you'll be able to explicitly define which header/body keys to record.

You can also redact specific headers by using networkRecording.networkHeadersToRedact and redact specific keys in the request/response body with networkRecoding.networkBodyKeysToRedact.

This configuration is only available for versions newer than 4.1.0.


See NetworkRecordingOptions for more information on how to configure network recording.


We extract GraphQL operation names and format the payloads. See GraphQL details.