fetch-sse
TypeScript icon, indicating that this package has built-in type declarations

1.0.23 • Public • Published

Fetch SSE (Server-Sent Events)

This package provides an easy API for making Event Source requests with all the features of Fetch API, and supports browsers and nodejs.

Install

npm install fetch-sse

Usage

import { fetchEventData } from 'fetch-sse';

await fetchEventData('/api/sse', {
  method: 'POST',
  data: { foo: 'bar' },
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer token'
  },
  onMessage: (event) => {
    console.log(event);
  }
})

You can pass in other parameters in a similar way to the Fetch API.

import { fetchEventData } from 'fetch-sse';

await fetchEventData('/api/sse', {
  method: 'POST',
  data: { foo: 'bar' },
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer token'
  },
  signal: ctrl.signal,
  onMessage: (event) => {
    console.log(event.data);
  }
})

Interface

export interface IFetchOptions {
  method?: string;
  headers?: HeadersInit | Record<string, any>;
  data?: Record<string, any>;
  signal?: AbortSignal;
  onMessage?: (event: ServerSentEvent | null, done?: boolean) => void;
  onOpen?: () => void;
  onClose?: () => void;
  onError?: (error: any) => void;
}

// decoded event
export interface ServerSentEvent {
  event: string | null;
  data: string;
  raw: string[];
}

Event stream pattern

The event stream is a simple stream of text data that encoded using UTF-8. You can find more information here.

  • Data-only messages

raw:


data: {"username": "bobby", "time": "02:33:48"}\n\n

parsed:

{
  event: null,
  data: '{"username": "bobby", "time": "02:33:48"}',
  raw: [
    'data: {"username": "bobby", "time": "02:33:48"}'
  ]
}
  • Named events

raw:

:HTTP\n
id: 1\n
event: result\n
data: {"username": "bobby", "time": "02:33:48"}\n\n

parsed:

{
  event: 'result',
  data: {"username": "bobby", "time": "02:33:48"},
  raw: [
    ':HTTP',
    'id: 1',
    'event: result',
    'data: {"username": "bobby", "time": "02:33:48"}'
  ]
}

Compatibility

this package is written in typescript and compatible with browsers and nodejs, You might need to polyfill TextDecoder for old versions of browsers.

Dependencies (0)

    Dev Dependencies (11)

    Package Sidebar

    Install

    npm i fetch-sse

    Weekly Downloads

    141

    Version

    1.0.23

    License

    MIT

    Unpacked Size

    29.8 kB

    Total Files

    25

    Last publish

    Collaborators

    • zac_ma