UNPKG

@sentool/fetch-event-source

Version:

Using the Fetch API to request an SSE endpoint.

86 lines (65 loc) 2.29 kB
[English](./README.md) · 中文 [npm]: https://img.shields.io/npm/v/@sentool/fetch-event-source [npm-url]: https://www.npmjs.com/package/@sentool/fetch-event-source [size]: https://packagephobia.now.sh/badge?p=@sentool/fetch-event-source [size-url]: https://packagephobia.now.sh/result?p=@sentool/fetch-event-source [![npm][npm]][npm-url] [![size][size]][size-url] # @sentool/fetch-event-source 使用 [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) 请求 SSE(Server-Sent Events)端点。它是对 `@microsoft/fetch-event-source` 项目的重构,代码实现得更为简练,支持在 Node.js 和浏览器中使用。 ## 安装 ```bash npm install @sentool/fetch-event-source ``` ## 使用 ```js import { fetchEventSource } from '@sentool/fetch-event-source'; await fetchEventSource('/api/sse', { method: 'POST', headers: { "Content-Type": "application/json", "Authorization": "Bearer <token>", }, body: JSON.stringify({ input: "" }), onopen(response) { console.log('Request has been opened.'); }, onmessage(event) { console.log(event); }, onerror(error) { console.error(error); }, done() { console.log('Stream has completed.'); }, }); ``` 或在浏览器中通过 CDN 的方式引入 ```js <script src="https://unpkg.com/@sentool/fetch-event-source/dist/index.min.js"></script> <script type="module"> const { fetchEventSource } = FetchEventSource; fetchEventSource(url, options); </script> ``` 你可以在任意事件中随时中止请求,如: ```js const eventSource = await fetchEventSource(url, options); // 这里假设在 3 秒后中止 setTimeout(() => { eventSource.abort(); }, 3000); ``` ### Options 除了支持 Fetch API 自带的 [RequestInit](https://developer.mozilla.org/en-US/docs/Web/API/RequestInit) 选项外,我们还添加了以下选项: | 选项 | 类型 | 说明 | | --- | --- | --- | | `onopen` | function | 请求成功打开后触发 | | `onmessage` | function | 接受到事件流数据时触发。 | | `onerror` | function | 出错时触发 | | `done` | function | 事件流完成后触发 | | `parseJson` | boolean | 是否自动解析响应数据中的 JSON 字符。默认 `true` | ## License MIT © [sentool](https://github.com/sentool)