jsonpipe

2.2.0 verified Sat May 09 auth: no javascript

jsonpipe is a lightweight, standalone AJAX client for consuming chunked (Transfer-Encoding: chunked) JSON responses in the browser. Version 2.2.0 (latest) ships TypeScript types. It exposes a single `flow` function with an API similar to jQuery.ajax, but tailored for streaming JSON delimited by double newlines (`\n\n`). No dependencies, supports IE8+, and allows per-chunk callbacks. Differentiators: minimal footprint, automatic delimiter-based JSON parsing, and configurable delimiter.

Common errors

error TypeError: Cannot read property 'flow' of undefined ↓

cause Using CommonJS destructuring on the require result, which is a function, not an object.

fix

Use const jsonpipe = require('jsonpipe'); jsonpipe.flow(...); instead of const { flow } = require('jsonpipe');

error Uncaught SyntaxError: Unexpected token < in JSON at position 0 ↓

cause Server returns HTML or invalid JSON; or delimiter not set correctly causing malformed chunks.

fix

Ensure server sends valid JSON objects separated by \n\n and set the correct delimiter option if different.

error NetworkError: Failed to execute 'send' on 'XMLHttpRequest' ↓

cause The request was aborted or a network issue occurred; or `withCredentials` not supported in some CORS configurations.

fix

Check server CORS headers and ensure withCredentials is used only if the server allows credentials.

Warnings

gotcha jsonpipe expects JSON objects separated by double newline (`\n\n`) by default. If the server uses a different delimiter, you must set the `delimiter` option. ↓

fix Set `delimiter` in the options object to the correct separator string.

gotcha The `data` option sends a request body. If `data` is not a string (e.g., FormData, File, Blob), you must set `disableContentType: true` to avoid overwriting the Content-Type header. ↓

fix Set `disableContentType: true` when sending non-string data.

gotcha jsonpipe only works in browser environments (IE8+). It relies on XMLHttpRequest and is not compatible with Node.js or server-side rendering. ↓

fix Use in browser context only. For Node.js streaming, consider alternatives like `fetch` with ReadableStream.

gotcha The `onHeaders` callback receives arguments (statusText, headers) but `headers` is an object, not a string. Some users expect a string header. ↓

fix Access individual header values via `headers['Content-Type']` or similar.

Install

npm install jsonpipe

yarn add jsonpipe

pnpm add jsonpipe

Imports

flow
wrong
```
const jsonpipe = require('jsonpipe');
jsonpipe.flow(...);
```
correct
```
import { flow } from 'jsonpipe';
```
ESM and TypeScript: named import. The default export is the flow function itself, but named import is correct for TS. No default export exists.
jsonpipe (default)
wrong
```
const jsonpipe = require('jsonpipe').default;
```
correct
```
import jsonpipe from 'jsonpipe';
```
If using ESM without named imports, default import works. But TypeScript types recommend named import.
jsonpipe (CommonJS)
wrong
```
const { flow } = require('jsonpipe');
```
correct
```
const jsonpipe = require('jsonpipe');
```
CommonJS require returns a function (the flow function) directly. Destructuring will fail.

Quickstart

Initializes a streaming GET request that logs each JSON chunk as it arrives, along with error and completion handlers.

import { flow } from 'jsonpipe';

// Sample endpoint that returns chunked JSON separated by \n\n
flow('https://api.example.com/stream', {
  success: (data) => {
    console.log('Received chunk:', data);
  },
  error: (msg) => {
    console.error('Error:', msg);
  },
  complete: (statusText) => {
    console.log('Request completed with status:', statusText);
  },
  timeout: 5000,
  method: 'GET'
});