Network Monitoring

The WhatzBug SDK automatically intercepts all XHR and fetch requests in your React Native app, capturing headers, bodies, timing, and status codes with built-in PII redaction.

How It Works

The SDK patches the global XMLHttpRequest and fetch APIs at initialization time. Every HTTP request is captured transparently — no changes to your networking code are required.

For each request, the SDK captures:

• Method and URL
• Request and response headers
• Request and response bodies
• Status code
• Timing — start time, duration, TTFB
• Screen context — which screen initiated the request

Enabling Network Monitoring

Network monitoring is enabled by default:

await WhatzBug.init({
  projectId: 'your-project-id',
  publishableKey: 'pk_your_key',
  features: {
    network: true, // default: true
  },
});

PII Redaction

Before network data is captured or streamed, the SDK’s redaction engine scans request and response bodies for common PII patterns and replaces them with [REDACTED].

Detected patterns include email addresses, phone numbers, credit card numbers, and SSN-like sequences.

Redaction is enabled by default during debug mode. See the PII Redaction docs for full details.

Viewing Network Data

• Desktop App → Network Panel: Real-time request list with detail view, headers, bodies, timing, and PII warning indicators.
• Desktop App → Performance Panel: Network performance metrics (request count, sizes, timing distributions).

Disabling Network Monitoring

await WhatzBug.init({
  projectId: 'your-project-id',
  features: {
    network: false,
  },
});

Related