Network Inspection
Capture and inspect HTTP network calls from Dio or Serverpod.
The network inspector captures every HTTP request, response, and error made through your HTTP client, storing them in memory for real-time inspection.
Setup with Dio
import 'package:xray_inspector/xray_inspector.dart';
import 'package:xray_network_dio_interceptor/xray_network_dio_interceptor.dart';
import 'package:dio/dio.dart';
final networkInspector = XRayNetworkInspector();
final dio = Dio()
..interceptors.add(
XRayNetworkDioInterceptor(inspector: networkInspector),
);
Accessing captured calls
// All captured calls (snapshot)
final calls = networkInspector.calls;
// Reactive — rebuilds your widget when calls change
ValueListenableBuilder<List<XRayNetworkCall>>(
valueListenable: networkInspector.callsNotifier,
builder: (context, calls, _) {
return Text('${calls.length} calls captured');
},
);
Listening to new calls in code
Implement XRayNetworkInterceptorListener and register it:
class MyListener implements XRayNetworkInterceptorListener {
@override
void onNetworkCallAdded(XRayNetworkCall call) {
debugPrint('[Network] ${call.method} ${call.uri} → ${call.responseStatusCode}');
}
}
final listener = MyListener();
networkInspector.addListener(listener);
// Clean up when done
networkInspector.removeListener(listener);
Custom inspector title
final networkInspector = XRayNetworkInspector(title: 'API Calls');
The title is displayed in the remote UI and used to generate the inspector's ID.
Network call model
Each captured call is an XRayNetworkCall with these fields:
| Field | Type | Description |
|---|---|---|
id | String | Unique ID (timestamp-based) |
method | String | HTTP method (GET, POST, etc.) |
uri | String | Full request URI |
requestHeaders | Map<String, dynamic>? | Request headers |
requestBody | dynamic | Request body |
responseStatusCode | int? | HTTP status code |
responseHeaders | Map<String, dynamic>? | Response headers |
responseBody | dynamic | Response body |
status | XRayNetworkCallStatus | loading / success / error |
startTime | DateTime | When the request started |
endTime | DateTime? | When the request completed |
durationMs | int? | Duration in milliseconds |
error | String? | Error message if failed |
Multiple network inspectors
You can run multiple network inspectors simultaneously, each with a distinct title:
final apiInspector = XRayNetworkInspector(title: 'API');
final analyticsInspector = XRayNetworkInspector(title: 'Analytics');
final apiDio = Dio()
..interceptors.add(XRayNetworkDioInterceptor(inspector: apiInspector));
final analyticsDio = Dio()
..interceptors.add(XRayNetworkDioInterceptor(inspector: analyticsInspector));