# xhr-sniffer
[](https://www.npmjs.com/package/xhr-sniffer)
[](https://badge.fury.io/js/xhr-sniffer)
[](https://www.npmjs.com/package/xhr-sniffer)
[](https://packagephobia.com/result?p=xhr-sniffer)
[](https://piecioshka.mit-license.org)
[](https://github.com/piecioshka/xhr-sniffer/actions/workflows/testing.yml)
[](https://github.com/prettier/prettier)
🔨 Sniff HTTP requests made by `XMLHttpRequest` / `Fetch API` in the browser or the `http`/`https` module in Node.js
## Preview 🎉
Every intercepted request is logged to the console in a single, consistent line:
```text
[2026-06-29 13:25:41.812] XMLHttpRequest GET OK https://example.org/ [128ms]
[2026-06-29 13:25:42.004] Fetch POST OK https://example.org/api [73ms]
[2026-06-29 13:25:42.310] http.request GET OK / [54ms]
```
Each line contains:
- a timestamp (`YYYY-MM-DD HH:mm:ss.SSS`),
- the source label (`XMLHttpRequest`, `Fetch` or `http.request`),
- the HTTP method (padded to 6 characters),
- the response status text,
- the request URL (or path in Node.js),
- the request duration in milliseconds.
## Features
- ✅ Logs `XMLHttpRequest` calls in the DevTools console
- ✅ Logs `Fetch API` calls in the DevTools console
- ✅ Logs `http` / `https` module calls in Node.js
- ✅ Zero runtime dependencies
- ✅ Reversible in Node.js — `install()` / `uninstall()`
## How it works
The library monkey-patches the relevant network primitives so that every request
flows through a logging wrapper before the original implementation runs.
| Environment | Patched APIs |
| ----------- | ------------------------------------------------------------------ |
| Browser | `XMLHttpRequest.prototype.open` / `send`, `window.fetch` |
| Node.js | `https.request` (the `http` module routes through `https` as well) |
The original behaviour is preserved — the wrappers only observe and log, then
delegate to the native call.
## Installation
```bash
npm install xhr-sniffer
```
## Usage
### Sniff requests in Node.js
Calling `install()` patches `https.request`. Use `uninstall()` to restore the
original implementation when you no longer need the logs.
```javascript
const xhrSniffer = require('xhr-sniffer');
xhrSniffer.install();
// ...perform your HTTP requests...
xhrSniffer.uninstall();
```
Example with the native `https` module:
```javascript
const xhrSniffer = require('xhr-sniffer');
const { request } = require('https');
xhrSniffer.install();
request({ hostname: 'example.org', path: '/', method: 'GET' }, (res) => {
res.on('data', () => {});
}).end();
```
> [!NOTE]
> The Node.js entry point patches `https.request`. Plain `http://` requests
> made through the `http` module are not intercepted — use `https` (see the
> `WARNING` note in [`src/server.js`](src/server.js)).
### Sniff requests in the browser
Build the browser bundle (or use the one published in the package) and attach it
in the `` so it patches the network APIs before your application runs:
```html
```
After that, any `XMLHttpRequest` or `fetch()` call is logged automatically. The
browser build patches the globals on load — there is no `install()` step.
## API
### Node.js
| Method | Description |
| ------------- | ------------------------------------------------------------ |
| `install()` | Patches `https.request` and starts logging requests. |
| `uninstall()` | Restores the original `https.request`, stopping the logging. |
### Browser
The browser bundle patches `XMLHttpRequest` and `window.fetch` automatically on
load; it exposes no public API.
## Development
```bash
npm install # install dependencies
npm run build # bundle the browser build into dist/ via esbuild
npm test # run the unit tests (vitest)
npm run coverage # run the tests with a coverage report
npm run lint # lint src/ and demo/ with eslint
```
The demos under [`demo/`](demo/) are good entry points:
- [`demo/browser/`](demo/browser/) — open `index.html` in a browser.
- [`demo/server/native.js`](demo/server/native.js) — `https` module example.
- [`demo/server/lib-fetch.js`](demo/server/lib-fetch.js) — `node-fetch` example.
## License
[The MIT License](https://piecioshka.mit-license.org) @ 2026