├── .github └── workflows │ └── node.js.yml ├── .gitignore ├── .npmignore ├── .nycrc ├── CHANGELOG.md ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── SECURITY.md ├── jasmine.json ├── package-lock.json ├── package.json ├── src ├── fetch.ts ├── index.ts ├── parse.spec.ts └── parse.ts ├── tsconfig.esm.json └── tsconfig.json /.github/workflows/node.js.yml: -------------------------------------------------------------------------------- 1 | # This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node 2 | # For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions 3 | 4 | name: Node.js CI 5 | 6 | on: 7 | push: 8 | branches: [ main ] 9 | pull_request: 10 | branches: [ main ] 11 | 12 | jobs: 13 | build: 14 | 15 | runs-on: ubuntu-latest 16 | 17 | strategy: 18 | matrix: 19 | node-version: [12.x, 14.x] 20 | 21 | steps: 22 | - uses: actions/checkout@v2 23 | - name: Use Node.js ${{ matrix.node-version }} 24 | uses: actions/setup-node@v1 25 | with: 26 | node-version: ${{ matrix.node-version }} 27 | - run: npm ci 28 | - run: npm run build --if-present 29 | - run: npm test 30 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .nyc_output/ 2 | coverage/ 3 | lib/ 4 | node_modules/ -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | .github/ 2 | .nyc_output/ 3 | coverage/ 4 | lib/*.map 5 | lib/*.spec.* 6 | src/ 7 | .nycrc 8 | jasmine.json 9 | tsconfig.json 10 | *.md 11 | 12 | ## IntellIJ files 13 | .idea 14 | *.iml 15 | -------------------------------------------------------------------------------- /.nycrc: -------------------------------------------------------------------------------- 1 | { 2 | "all": true, 3 | "reporter": [ 4 | "html", 5 | "text-summary" 6 | ], 7 | "exclude": [ 8 | "coverage/", 9 | "src/*.spec.ts" 10 | ], 11 | "require": [ 12 | "source-map-support/register" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # CHANGELOG 2 | 3 | ## 2.0.1 4 | This release adds support for esmodule imports (see #4). 5 | 6 | ## 2.0.0 7 | This release improves the performance of parsing the response stream and fixes some corner cases to better match [the spec](https://html.spec.whatwg.org/multipage/server-sent-events.html#event-stream-interpretation). 8 | 9 | ### Changed 10 | - The `id`, `event`, and `data` fields are now initialized to empty strings, per the spec (they were previously `undefined`) 11 | - The `onmessage` callback is now called for _all_ messages (it was previously triggered only for messages with a `data` field) 12 | - If a message contains multiple `data` fields, they will be concatenated together into a single string. For example, the following message: 13 | ```` 14 | data: Foo 15 | data:Bar 16 | data 17 | data: Baz 18 | ```` 19 | will result in `{ data: 'Foo\nBar\n\nBaz' }` 20 | 21 | - If the server sends an `id` field with an empty value, the last-event-id header will no longer be sent on the next reconnect. 22 | 23 | ### Removed 24 | - The internal `parseStream` function has been removed. The parse implementation was previously based on async generators, which required a lot of supporting code in both the typescript-generated polyfill as well as the javascript engine. The new implementation is based on simple callbacks, which should be much faster. 25 | 26 | ## 1.0.2 27 | ### Changed 28 | - Updated examples in readme to fix typos, added more comments. 29 | - Changed `if` statements in parse.ts to test for specific values instead of truthy/falsy values. 30 | 31 | ## 1.0.1 32 | ### Changed 33 | - Changed the default onOpen validator to allow charset and boundary directives in the content-type 34 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Microsoft Open Source Code of Conduct 2 | 3 | This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). 4 | 5 | Resources: 6 | 7 | - [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) 8 | - [Microsoft Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) 9 | - Contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with questions or concerns 10 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing to @microsoft/fetch-event-source 2 | 3 | Please take a moment to review this document in order to make the contribution process easy and effective for everyone involved. 4 | 5 | Following these guidelines helps to communicate that you respect the time of the developers managing and developing this open source project. In return, they should reciprocate that respect in addressing your issue or assessing patches and features. 6 | 7 | 8 | ## Using the issue tracker 9 | 10 | The [issue tracker](https://github.com/Azure/fetch-event-source/issues) is 11 | the preferred channel for [bug reports](#bugs), [features requests](#features) 12 | and [submitting pull requests](#pull-requests). 13 | 14 | 15 | ## Bug reports 16 | 17 | A bug is a _demonstrable problem_ that is caused by the code in the repository. 18 | Good bug reports are extremely helpful - thank you! 19 | 20 | Guidelines for bug reports: 21 | 22 | 1. **Use the GitHub issue search** — check if the issue has already been 23 | reported. 24 | 25 | 2. **Check if the issue has been fixed** — try to reproduce it using the 26 | latest `main` or development branch in the repository. 27 | 28 | 3. **Isolate the problem** — ideally create a [reduced test 29 | case](https://css-tricks.com/reduced-test-cases/) and a live example. 30 | 31 | A good bug report shouldn't leave others needing to chase you up for more 32 | information. Please try to be as detailed as possible in your report. What is 33 | your environment? What steps will reproduce the issue? What browser(s) and OS 34 | experience the problem? What would you expect to be the outcome? All these 35 | details will help people to fix any potential bugs. 36 | 37 | Example: 38 | 39 | > Short and descriptive example bug report title 40 | > 41 | > A summary of the issue and the browser/OS environment in which it occurs. If 42 | > suitable, include the steps required to reproduce the bug. 43 | > 44 | > 1. This is the first step 45 | > 2. This is the second step 46 | > 3. Further steps, etc. 47 | > 48 | > `` - a link to the reduced test case 49 | > 50 | > Any other information you want to share that is relevant to the issue being 51 | > reported. This might include the lines of code that you have identified as 52 | > causing the bug, and potential solutions (and your opinions on their 53 | > merits). 54 | 55 | 56 | 57 | ## Feature requests 58 | 59 | Feature requests are welcome. But take a moment to find out whether your idea 60 | fits with the scope and aims of the project. It's up to *you* to make a strong 61 | case to convince the project's developers of the merits of this feature. Please 62 | provide as much detail and context as possible. 63 | 64 | 65 | 66 | ## Pull requests 67 | 68 | Good pull requests - patches, improvements, new features - are a fantastic 69 | help. They should remain focused in scope and avoid containing unrelated 70 | commits. 71 | 72 | **Please ask first** before embarking on any significant pull request (e.g. 73 | implementing features, refactoring code, porting to a different language), 74 | otherwise you risk spending a lot of time working on something that the 75 | project's developers might not want to merge into the project. 76 | 77 | Please adhere to the coding conventions used throughout a project (indentation, 78 | accurate comments, etc.) and any other requirements (such as test coverage). 79 | 80 | Adhering to the following process is the best way to get your work 81 | included in the project: 82 | 83 | 1. [Fork](https://help.github.com/articles/fork-a-repo/) the project, clone your 84 | fork, and configure the remotes: 85 | 86 | ```bash 87 | # Clone your fork of the repo into the current directory 88 | git clone https://github.com//fetch-event-source.git 89 | # Navigate to the newly cloned directory 90 | cd fetch-event-source 91 | # Assign the original repo to a remote called "upstream" 92 | git remote add upstream https://github.com/Azure/fetch-event-source.git 93 | ``` 94 | 95 | 2. If you cloned a while ago, get the latest changes from upstream: 96 | 97 | ```bash 98 | git checkout main 99 | git pull upstream main 100 | ``` 101 | 102 | 3. Create a new topic branch (off the main project development branch) to 103 | contain your feature, change, or fix: 104 | 105 | ```bash 106 | git checkout -b 107 | ``` 108 | 109 | 4. Locally merge (or rebase) the upstream development branch into your topic branch: 110 | 111 | ```bash 112 | git pull [--rebase] upstream main 113 | ``` 114 | 115 | 5. Push your topic branch up to your fork: 116 | 117 | ```bash 118 | git push origin 119 | ``` 120 | 121 | 6. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/) 122 | with a clear title and description. As part of your PR, also: 123 | 124 | a. Update the version in package.json, **but do not publish it yet**: wait till the PR has been reviewed. If you need a version published before this, you can use prerelease tags: set the package version to something like `6.0.0-prerelease.7` and run `npm publish . --tag prerelease`. 125 | 126 | 127 | b. Update the [changelog](CHANGELOG.md) with your changes. 128 | 129 | ### Cutting a release 130 | 131 | Once the PR has been reviewed, follow these steps to cut a release: 132 | 133 | 1. [Squash and merge](https://help.github.com/articles/about-pull-request-merges/#squash-and-merge-your-pull-request-commits) your PR. Copy the PR description into the commit text. 134 | 135 | 2. Once the PR has been merged, tag the merge commit with the version: 136 | 137 | a. `git checkout main && git pull origin main` 138 | 139 | b. `git tag v` (e.g., `git tag v6.0.0`) 140 | 141 | c. `git push origin v` 142 | 143 | 3. [Create a new github release](https://github.com/Azure/iot-ux-fluent-controls/releases/new) on the new tag. Use the tag name as the release title and the copy the changelog into the description. 144 | 145 | 146 | **IMPORTANT**: By submitting a patch, you agree to allow the project 147 | owners to license your work under the terms of the [MIT License](LICENSE.txt). 148 | 149 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) Microsoft Corporation. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Fetch Event Source 2 | This package provides a better API for making [Event Source requests](https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events) - also known as server-sent events - with all the features available in the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API). 3 | 4 | The [default browser EventSource API](https://developer.mozilla.org/en-US/docs/Web/API/EventSource) imposes several restrictions on the type of request you're allowed to make: the [only parameters](https://developer.mozilla.org/en-US/docs/Web/API/EventSource/EventSource#Parameters) you're allowed to pass in are the `url` and `withCredentials`, so: 5 | * You cannot pass in a request body: you have to encode all the information necessary to execute the request inside the URL, which is [limited to 2000 characters](https://stackoverflow.com/questions/417142) in most browsers. 6 | * You cannot pass in custom request headers 7 | * You can only make GET requests - there is no way to specify another method. 8 | * If the connection is cut, you don't have any control over the retry strategy: the browser will silently retry for you a few times and then stop, which is not good enough for any sort of robust application. 9 | 10 | This library provides an alternate interface for consuming server-sent events, based on the Fetch API. It is fully compatible with the [Event Stream format](https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events#Event_stream_format), so if you already have a server emitting these events, you can consume it just like before. However, you now have greater control over the request and response so: 11 | 12 | * You can use any request method/headers/body, plus all the other functionality exposed by fetch(). You can even provide an alternate fetch() implementation, if the default browser implementation doesn't work for you. 13 | * You have access to the response object if you want to do some custom validation/processing before parsing the event source. This is useful in case you have API gateways (like nginx) in front of your application server: if the gateway returns an error, you might want to handle it correctly. 14 | * If the connection gets cut or an error occurs, you have full control over the retry strategy. 15 | 16 | In addition, this library also plugs into the browser's [Page Visibility API](https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API) so the connection closes if the document is hidden (e.g., the user minimizes the window), and automatically retries with the last event ID when it becomes visible again. This reduces the load on your server by not having open connections unnecessarily (but you can opt out of this behavior if you want.) 17 | 18 | # Install 19 | ```sh 20 | npm install @microsoft/fetch-event-source 21 | ``` 22 | 23 | # Usage 24 | ```ts 25 | // BEFORE: 26 | const sse = new EventSource('/api/sse'); 27 | sse.onmessage = (ev) => { 28 | console.log(ev.data); 29 | }; 30 | 31 | // AFTER: 32 | import { fetchEventSource } from '@microsoft/fetch-event-source'; 33 | 34 | await fetchEventSource('/api/sse', { 35 | onmessage(ev) { 36 | console.log(ev.data); 37 | } 38 | }); 39 | ``` 40 | 41 | You can pass in all the [other parameters](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch#Parameters) exposed by the default fetch API, for example: 42 | ```ts 43 | const ctrl = new AbortController(); 44 | fetchEventSource('/api/sse', { 45 | method: 'POST', 46 | headers: { 47 | 'Content-Type': 'application/json', 48 | }, 49 | body: JSON.stringify({ 50 | foo: 'bar' 51 | }), 52 | signal: ctrl.signal, 53 | }); 54 | ``` 55 | 56 | You can add better error handling, for example: 57 | ```ts 58 | class RetriableError extends Error { } 59 | class FatalError extends Error { } 60 | 61 | fetchEventSource('/api/sse', { 62 | async onopen(response) { 63 | if (response.ok && response.headers.get('content-type') === EventStreamContentType) { 64 | return; // everything's good 65 | } else if (response.status >= 400 && response.status < 500 && response.status !== 429) { 66 | // client-side errors are usually non-retriable: 67 | throw new FatalError(); 68 | } else { 69 | throw new RetriableError(); 70 | } 71 | }, 72 | onmessage(msg) { 73 | // if the server emits an error message, throw an exception 74 | // so it gets handled by the onerror callback below: 75 | if (msg.event === 'FatalError') { 76 | throw new FatalError(msg.data); 77 | } 78 | }, 79 | onclose() { 80 | // if the server closes the connection unexpectedly, retry: 81 | throw new RetriableError(); 82 | }, 83 | onerror(err) { 84 | if (err instanceof FatalError) { 85 | throw err; // rethrow to stop the operation 86 | } else { 87 | // do nothing to automatically retry. You can also 88 | // return a specific retry interval here. 89 | } 90 | } 91 | }); 92 | ``` 93 | 94 | # Compatibility 95 | This library is written in typescript and targets ES2017 features supported by all evergreen browsers (Chrome, Firefox, Safari, Edge.) You might need to [polyfill TextDecoder](https://www.npmjs.com/package/fast-text-encoding) for old Edge (versions < 79), though: 96 | ```js 97 | require('fast-text-encoding'); 98 | ``` 99 | 100 | # Contributing 101 | 102 | This project welcomes contributions and suggestions. Most contributions require you to agree to a 103 | Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us 104 | the rights to use your contribution. For details, visit https://cla.opensource.microsoft.com. 105 | 106 | When you submit a pull request, a CLA bot will automatically determine whether you need to provide 107 | a CLA and decorate the PR appropriately (e.g., status check, comment). Simply follow the instructions 108 | provided by the bot. You will only need to do this once across all repos using our CLA. 109 | 110 | This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). 111 | For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or 112 | contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments. 113 | -------------------------------------------------------------------------------- /SECURITY.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | ## Security 4 | 5 | Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/). 6 | 7 | If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](https://docs.microsoft.com/en-us/previous-versions/tn-archive/cc751383(v=technet.10)), please report it to us as described below. 8 | 9 | ## Reporting Security Issues 10 | 11 | **Please do not report security vulnerabilities through public GitHub issues.** 12 | 13 | Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report). 14 | 15 | If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com). If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://www.microsoft.com/en-us/msrc/pgp-key-msrc). 16 | 17 | You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://www.microsoft.com/msrc). 18 | 19 | Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue: 20 | 21 | * Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.) 22 | * Full paths of source file(s) related to the manifestation of the issue 23 | * The location of the affected source code (tag/branch/commit or direct URL) 24 | * Any special configuration required to reproduce the issue 25 | * Step-by-step instructions to reproduce the issue 26 | * Proof-of-concept or exploit code (if possible) 27 | * Impact of the issue, including how an attacker might exploit the issue 28 | 29 | This information will help us triage your report more quickly. 30 | 31 | If you are reporting for a bug bounty, more complete reports can contribute to a higher bounty award. Please visit our [Microsoft Bug Bounty Program](https://microsoft.com/msrc/bounty) page for more details about our active programs. 32 | 33 | ## Preferred Languages 34 | 35 | We prefer all communications to be in English. 36 | 37 | ## Policy 38 | 39 | Microsoft follows the principle of [Coordinated Vulnerability Disclosure](https://www.microsoft.com/en-us/msrc/cvd). 40 | 41 | -------------------------------------------------------------------------------- /jasmine.json: -------------------------------------------------------------------------------- 1 | { 2 | "spec_dir": "lib", 3 | "spec_files": [ 4 | "**/*.spec.js" 5 | ] 6 | } 7 | -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@microsoft/fetch-event-source", 3 | "version": "2.0.1", 4 | "lockfileVersion": 2, 5 | "requires": true, 6 | "packages": { 7 | "": { 8 | "name": "@microsoft/fetch-event-source", 9 | "version": "2.0.1", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "@types/jasmine": "^4.3.1", 13 | "rimraf": "^3.0.2", 14 | "source-map-support": "^0.5.19", 15 | "typescript": "^4.2.4" 16 | } 17 | }, 18 | "node_modules/@types/jasmine": { 19 | "version": "4.3.1", 20 | "resolved": "https://registry.npmjs.org/@types/jasmine/-/jasmine-4.3.1.tgz", 21 | "integrity": "sha512-Vu8l+UGcshYmV1VWwULgnV/2RDbBaO6i2Ptx7nd//oJPIZGhoI1YLST4VKagD2Pq/Bc2/7zvtvhM7F3p4SN7kQ==", 22 | "dev": true 23 | }, 24 | "node_modules/balanced-match": { 25 | "version": "1.0.2", 26 | "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", 27 | "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", 28 | "dev": true 29 | }, 30 | "node_modules/brace-expansion": { 31 | "version": "1.1.11", 32 | "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", 33 | "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", 34 | "dev": true, 35 | "dependencies": { 36 | "balanced-match": "^1.0.0", 37 | "concat-map": "0.0.1" 38 | } 39 | }, 40 | "node_modules/buffer-from": { 41 | "version": "1.1.2", 42 | "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz", 43 | "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==", 44 | "dev": true 45 | }, 46 | "node_modules/concat-map": { 47 | "version": "0.0.1", 48 | "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", 49 | "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==", 50 | "dev": true 51 | }, 52 | "node_modules/fs.realpath": { 53 | "version": "1.0.0", 54 | "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", 55 | "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==", 56 | "dev": true 57 | }, 58 | "node_modules/glob": { 59 | "version": "7.2.3", 60 | "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", 61 | "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", 62 | "dev": true, 63 | "dependencies": { 64 | "fs.realpath": "^1.0.0", 65 | "inflight": "^1.0.4", 66 | "inherits": "2", 67 | "minimatch": "^3.1.1", 68 | "once": "^1.3.0", 69 | "path-is-absolute": "^1.0.0" 70 | }, 71 | "engines": { 72 | "node": "*" 73 | }, 74 | "funding": { 75 | "url": "https://github.com/sponsors/isaacs" 76 | } 77 | }, 78 | "node_modules/inflight": { 79 | "version": "1.0.6", 80 | "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", 81 | "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==", 82 | "dev": true, 83 | "dependencies": { 84 | "once": "^1.3.0", 85 | "wrappy": "1" 86 | } 87 | }, 88 | "node_modules/inherits": { 89 | "version": "2.0.4", 90 | "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", 91 | "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", 92 | "dev": true 93 | }, 94 | "node_modules/minimatch": { 95 | "version": "3.1.2", 96 | "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", 97 | "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", 98 | "dev": true, 99 | "dependencies": { 100 | "brace-expansion": "^1.1.7" 101 | }, 102 | "engines": { 103 | "node": "*" 104 | } 105 | }, 106 | "node_modules/once": { 107 | "version": "1.4.0", 108 | "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", 109 | "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==", 110 | "dev": true, 111 | "dependencies": { 112 | "wrappy": "1" 113 | } 114 | }, 115 | "node_modules/path-is-absolute": { 116 | "version": "1.0.1", 117 | "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", 118 | "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==", 119 | "dev": true, 120 | "engines": { 121 | "node": ">=0.10.0" 122 | } 123 | }, 124 | "node_modules/rimraf": { 125 | "version": "3.0.2", 126 | "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", 127 | "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", 128 | "dev": true, 129 | "dependencies": { 130 | "glob": "^7.1.3" 131 | }, 132 | "bin": { 133 | "rimraf": "bin.js" 134 | }, 135 | "funding": { 136 | "url": "https://github.com/sponsors/isaacs" 137 | } 138 | }, 139 | "node_modules/source-map": { 140 | "version": "0.6.1", 141 | "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", 142 | "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", 143 | "dev": true, 144 | "engines": { 145 | "node": ">=0.10.0" 146 | } 147 | }, 148 | "node_modules/source-map-support": { 149 | "version": "0.5.21", 150 | "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz", 151 | "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==", 152 | "dev": true, 153 | "dependencies": { 154 | "buffer-from": "^1.0.0", 155 | "source-map": "^0.6.0" 156 | } 157 | }, 158 | "node_modules/typescript": { 159 | "version": "4.9.5", 160 | "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", 161 | "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", 162 | "dev": true, 163 | "bin": { 164 | "tsc": "bin/tsc", 165 | "tsserver": "bin/tsserver" 166 | }, 167 | "engines": { 168 | "node": ">=4.2.0" 169 | } 170 | }, 171 | "node_modules/wrappy": { 172 | "version": "1.0.2", 173 | "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", 174 | "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==", 175 | "dev": true 176 | } 177 | }, 178 | "dependencies": { 179 | "@types/jasmine": { 180 | "version": "4.3.1", 181 | "resolved": "https://registry.npmjs.org/@types/jasmine/-/jasmine-4.3.1.tgz", 182 | "integrity": "sha512-Vu8l+UGcshYmV1VWwULgnV/2RDbBaO6i2Ptx7nd//oJPIZGhoI1YLST4VKagD2Pq/Bc2/7zvtvhM7F3p4SN7kQ==", 183 | "dev": true 184 | }, 185 | "balanced-match": { 186 | "version": "1.0.2", 187 | "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", 188 | "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", 189 | "dev": true 190 | }, 191 | "brace-expansion": { 192 | "version": "1.1.11", 193 | "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", 194 | "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", 195 | "dev": true, 196 | "requires": { 197 | "balanced-match": "^1.0.0", 198 | "concat-map": "0.0.1" 199 | } 200 | }, 201 | "buffer-from": { 202 | "version": "1.1.2", 203 | "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz", 204 | "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==", 205 | "dev": true 206 | }, 207 | "concat-map": { 208 | "version": "0.0.1", 209 | "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", 210 | "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==", 211 | "dev": true 212 | }, 213 | "fs.realpath": { 214 | "version": "1.0.0", 215 | "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", 216 | "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==", 217 | "dev": true 218 | }, 219 | "glob": { 220 | "version": "7.2.3", 221 | "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", 222 | "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", 223 | "dev": true, 224 | "requires": { 225 | "fs.realpath": "^1.0.0", 226 | "inflight": "^1.0.4", 227 | "inherits": "2", 228 | "minimatch": "^3.1.1", 229 | "once": "^1.3.0", 230 | "path-is-absolute": "^1.0.0" 231 | } 232 | }, 233 | "inflight": { 234 | "version": "1.0.6", 235 | "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", 236 | "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==", 237 | "dev": true, 238 | "requires": { 239 | "once": "^1.3.0", 240 | "wrappy": "1" 241 | } 242 | }, 243 | "inherits": { 244 | "version": "2.0.4", 245 | "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", 246 | "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", 247 | "dev": true 248 | }, 249 | "minimatch": { 250 | "version": "3.1.2", 251 | "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", 252 | "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", 253 | "dev": true, 254 | "requires": { 255 | "brace-expansion": "^1.1.7" 256 | } 257 | }, 258 | "once": { 259 | "version": "1.4.0", 260 | "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", 261 | "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==", 262 | "dev": true, 263 | "requires": { 264 | "wrappy": "1" 265 | } 266 | }, 267 | "path-is-absolute": { 268 | "version": "1.0.1", 269 | "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", 270 | "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==", 271 | "dev": true 272 | }, 273 | "rimraf": { 274 | "version": "3.0.2", 275 | "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", 276 | "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", 277 | "dev": true, 278 | "requires": { 279 | "glob": "^7.1.3" 280 | } 281 | }, 282 | "source-map": { 283 | "version": "0.6.1", 284 | "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", 285 | "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", 286 | "dev": true 287 | }, 288 | "source-map-support": { 289 | "version": "0.5.21", 290 | "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz", 291 | "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==", 292 | "dev": true, 293 | "requires": { 294 | "buffer-from": "^1.0.0", 295 | "source-map": "^0.6.0" 296 | } 297 | }, 298 | "typescript": { 299 | "version": "4.9.5", 300 | "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", 301 | "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", 302 | "dev": true 303 | }, 304 | "wrappy": { 305 | "version": "1.0.2", 306 | "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", 307 | "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==", 308 | "dev": true 309 | } 310 | } 311 | } 312 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@microsoft/fetch-event-source", 3 | "version": "2.0.1", 4 | "description": "A better API for making Event Source requests, with all the features of fetch()", 5 | "homepage": "https://github.com/Azure/fetch-event-source#readme", 6 | "repository": "github:Azure/fetch-event-source", 7 | "bugs": { 8 | "url": "https://github.com/Azure/fetch-event-source/issues" 9 | }, 10 | "author": "Microsoft", 11 | "license": "MIT", 12 | "main": "lib/cjs/index.js", 13 | "module": "lib/esm/index.js", 14 | "types": "lib/cjs/index.d.ts", 15 | "sideEffects": false, 16 | "scripts": { 17 | "clean": "rimraf ./lib ./coverage", 18 | "prebuild": "npm run clean", 19 | "build": "tsc && tsc -p tsconfig.esm.json", 20 | "prepublishOnly": "npm run build && npm run test" 21 | }, 22 | "devDependencies": { 23 | "@types/jasmine": "^4.3.1", 24 | "rimraf": "^3.0.2", 25 | "source-map-support": "^0.5.19", 26 | "typescript": "^4.2.4" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/fetch.ts: -------------------------------------------------------------------------------- 1 | import { EventSourceMessage, getBytes, getLines, getMessages } from './parse'; 2 | 3 | export const EventStreamContentType = 'text/event-stream'; 4 | 5 | const DefaultRetryInterval = 1000; 6 | const LastEventId = 'last-event-id'; 7 | 8 | export interface FetchEventSourceInit extends RequestInit { 9 | /** 10 | * The request headers. FetchEventSource only supports the Record format. 11 | */ 12 | headers?: Record, 13 | 14 | /** 15 | * Called when a response is received. Use this to validate that the response 16 | * actually matches what you expect (and throw if it doesn't.) If not provided, 17 | * will default to a basic validation to ensure the content-type is text/event-stream. 18 | */ 19 | onopen?: (response: Response) => Promise, 20 | 21 | /** 22 | * Called when a message is received. NOTE: Unlike the default browser 23 | * EventSource.onmessage, this callback is called for _all_ events, 24 | * even ones with a custom `event` field. 25 | */ 26 | onmessage?: (ev: EventSourceMessage) => void; 27 | 28 | /** 29 | * Called when a response finishes. If you don't expect the server to kill 30 | * the connection, you can throw an exception here and retry using onerror. 31 | */ 32 | onclose?: () => void; 33 | 34 | /** 35 | * Called when there is any error making the request / processing messages / 36 | * handling callbacks etc. Use this to control the retry strategy: if the 37 | * error is fatal, rethrow the error inside the callback to stop the entire 38 | * operation. Otherwise, you can return an interval (in milliseconds) after 39 | * which the request will automatically retry (with the last-event-id). 40 | * If this callback is not specified, or it returns undefined, fetchEventSource 41 | * will treat every error as retriable and will try again after 1 second. 42 | */ 43 | onerror?: (err: any) => number | null | undefined | void, 44 | 45 | /** 46 | * If true, will keep the request open even if the document is hidden. 47 | * By default, fetchEventSource will close the request and reopen it 48 | * automatically when the document becomes visible again. 49 | */ 50 | openWhenHidden?: boolean; 51 | 52 | /** The Fetch function to use. Defaults to window.fetch */ 53 | fetch?: typeof fetch; 54 | } 55 | 56 | export function fetchEventSource(input: RequestInfo, { 57 | signal: inputSignal, 58 | headers: inputHeaders, 59 | onopen: inputOnOpen, 60 | onmessage, 61 | onclose, 62 | onerror, 63 | openWhenHidden, 64 | fetch: inputFetch, 65 | ...rest 66 | }: FetchEventSourceInit) { 67 | return new Promise((resolve, reject) => { 68 | // make a copy of the input headers since we may modify it below: 69 | const headers = { ...inputHeaders }; 70 | if (!headers.accept) { 71 | headers.accept = EventStreamContentType; 72 | } 73 | 74 | let curRequestController: AbortController; 75 | function onVisibilityChange() { 76 | curRequestController.abort(); // close existing request on every visibility change 77 | if (!document.hidden) { 78 | create(); // page is now visible again, recreate request. 79 | } 80 | } 81 | 82 | if (!openWhenHidden) { 83 | document.addEventListener('visibilitychange', onVisibilityChange); 84 | } 85 | 86 | let retryInterval = DefaultRetryInterval; 87 | let retryTimer = 0; 88 | function dispose() { 89 | document.removeEventListener('visibilitychange', onVisibilityChange); 90 | window.clearTimeout(retryTimer); 91 | curRequestController.abort(); 92 | } 93 | 94 | // if the incoming signal aborts, dispose resources and resolve: 95 | inputSignal?.addEventListener('abort', () => { 96 | dispose(); 97 | resolve(); // don't waste time constructing/logging errors 98 | }); 99 | 100 | const fetch = inputFetch ?? window.fetch; 101 | const onopen = inputOnOpen ?? defaultOnOpen; 102 | async function create() { 103 | curRequestController = new AbortController(); 104 | try { 105 | const response = await fetch(input, { 106 | ...rest, 107 | headers, 108 | signal: curRequestController.signal, 109 | }); 110 | 111 | await onopen(response); 112 | 113 | await getBytes(response.body!, getLines(getMessages(id => { 114 | if (id) { 115 | // store the id and send it back on the next retry: 116 | headers[LastEventId] = id; 117 | } else { 118 | // don't send the last-event-id header anymore: 119 | delete headers[LastEventId]; 120 | } 121 | }, retry => { 122 | retryInterval = retry; 123 | }, onmessage))); 124 | 125 | onclose?.(); 126 | dispose(); 127 | resolve(); 128 | } catch (err) { 129 | if (!curRequestController.signal.aborted) { 130 | // if we haven't aborted the request ourselves: 131 | try { 132 | // check if we need to retry: 133 | const interval: any = onerror?.(err) ?? retryInterval; 134 | window.clearTimeout(retryTimer); 135 | retryTimer = window.setTimeout(create, interval); 136 | } catch (innerErr) { 137 | // we should not retry anymore: 138 | dispose(); 139 | reject(innerErr); 140 | } 141 | } 142 | } 143 | } 144 | 145 | create(); 146 | }); 147 | } 148 | 149 | function defaultOnOpen(response: Response) { 150 | const contentType = response.headers.get('content-type'); 151 | if (!contentType?.startsWith(EventStreamContentType)) { 152 | throw new Error(`Expected content-type to be ${EventStreamContentType}, Actual: ${contentType}`); 153 | } 154 | } 155 | -------------------------------------------------------------------------------- /src/index.ts: -------------------------------------------------------------------------------- 1 | export { fetchEventSource, FetchEventSourceInit, EventStreamContentType } from './fetch'; 2 | export { EventSourceMessage } from './parse'; 3 | -------------------------------------------------------------------------------- /src/parse.spec.ts: -------------------------------------------------------------------------------- 1 | import * as parse from './parse'; 2 | 3 | describe('parse', () => { 4 | const encoder = new TextEncoder(); 5 | const decoder = new TextDecoder(); 6 | 7 | describe('getLines', () => { 8 | it('single line', () => { 9 | // arrange: 10 | let lineNum = 0; 11 | const next = parse.getLines((line, fieldLength) => { 12 | ++lineNum; 13 | expect(decoder.decode(line)).toEqual('id: abc'); 14 | expect(fieldLength).toEqual(2); 15 | }); 16 | 17 | // act: 18 | next(encoder.encode('id: abc\n')); 19 | 20 | // assert: 21 | expect(lineNum).toBe(1); 22 | }); 23 | 24 | it('multiple lines', () => { 25 | // arrange: 26 | let lineNum = 0; 27 | const next = parse.getLines((line, fieldLength) => { 28 | ++lineNum; 29 | expect(decoder.decode(line)).toEqual(lineNum === 1 ? 'id: abc' : 'data: def'); 30 | expect(fieldLength).toEqual(lineNum === 1 ? 2 : 4); 31 | }); 32 | 33 | // act: 34 | next(encoder.encode('id: abc\n')); 35 | next(encoder.encode('data: def\n')); 36 | 37 | // assert: 38 | expect(lineNum).toBe(2); 39 | }); 40 | 41 | it('single line split across multiple arrays', () => { 42 | // arrange: 43 | let lineNum = 0; 44 | const next = parse.getLines((line, fieldLength) => { 45 | ++lineNum; 46 | expect(decoder.decode(line)).toEqual('id: abc'); 47 | expect(fieldLength).toEqual(2); 48 | }); 49 | 50 | // act: 51 | next(encoder.encode('id: a')); 52 | next(encoder.encode('bc\n')); 53 | 54 | // assert: 55 | expect(lineNum).toBe(1); 56 | }); 57 | 58 | it('multiple lines split across multiple arrays', () => { 59 | // arrange: 60 | let lineNum = 0; 61 | const next = parse.getLines((line, fieldLength) => { 62 | ++lineNum; 63 | expect(decoder.decode(line)).toEqual(lineNum === 1 ? 'id: abc' : 'data: def'); 64 | expect(fieldLength).toEqual(lineNum === 1 ? 2 : 4); 65 | }); 66 | 67 | // act: 68 | next(encoder.encode('id: ab')); 69 | next(encoder.encode('c\nda')); 70 | next(encoder.encode('ta: def\n')); 71 | 72 | // assert: 73 | expect(lineNum).toBe(2); 74 | }); 75 | 76 | it('new line', () => { 77 | // arrange: 78 | let lineNum = 0; 79 | const next = parse.getLines((line, fieldLength) => { 80 | ++lineNum; 81 | expect(decoder.decode(line)).toEqual(''); 82 | expect(fieldLength).toEqual(-1); 83 | }); 84 | 85 | // act: 86 | next(encoder.encode('\n')); 87 | 88 | // assert: 89 | expect(lineNum).toBe(1); 90 | }); 91 | 92 | it('comment line', () => { 93 | // arrange: 94 | let lineNum = 0; 95 | const next = parse.getLines((line, fieldLength) => { 96 | ++lineNum; 97 | expect(decoder.decode(line)).toEqual(': this is a comment'); 98 | expect(fieldLength).toEqual(0); 99 | }); 100 | 101 | // act: 102 | next(encoder.encode(': this is a comment\n')); 103 | 104 | // assert: 105 | expect(lineNum).toBe(1); 106 | }); 107 | 108 | it('line with no field', () => { 109 | // arrange: 110 | let lineNum = 0; 111 | const next = parse.getLines((line, fieldLength) => { 112 | ++lineNum; 113 | expect(decoder.decode(line)).toEqual('this is an invalid line'); 114 | expect(fieldLength).toEqual(-1); 115 | }); 116 | 117 | // act: 118 | next(encoder.encode('this is an invalid line\n')); 119 | 120 | // assert: 121 | expect(lineNum).toBe(1); 122 | }); 123 | 124 | it('line with multiple colons', () => { 125 | // arrange: 126 | let lineNum = 0; 127 | const next = parse.getLines((line, fieldLength) => { 128 | ++lineNum; 129 | expect(decoder.decode(line)).toEqual('id: abc: def'); 130 | expect(fieldLength).toEqual(2); 131 | }); 132 | 133 | // act: 134 | next(encoder.encode('id: abc: def\n')); 135 | 136 | // assert: 137 | expect(lineNum).toBe(1); 138 | }); 139 | 140 | it('single byte array with multiple lines separated by \\n', () => { 141 | // arrange: 142 | let lineNum = 0; 143 | const next = parse.getLines((line, fieldLength) => { 144 | ++lineNum; 145 | expect(decoder.decode(line)).toEqual(lineNum === 1 ? 'id: abc' : 'data: def'); 146 | expect(fieldLength).toEqual(lineNum === 1 ? 2 : 4); 147 | }); 148 | 149 | // act: 150 | next(encoder.encode('id: abc\ndata: def\n')); 151 | 152 | // assert: 153 | expect(lineNum).toBe(2); 154 | }); 155 | 156 | it('single byte array with multiple lines separated by \\r', () => { 157 | // arrange: 158 | let lineNum = 0; 159 | const next = parse.getLines((line, fieldLength) => { 160 | ++lineNum; 161 | expect(decoder.decode(line)).toEqual(lineNum === 1 ? 'id: abc' : 'data: def'); 162 | expect(fieldLength).toEqual(lineNum === 1 ? 2 : 4); 163 | }); 164 | 165 | // act: 166 | next(encoder.encode('id: abc\rdata: def\r')); 167 | 168 | // assert: 169 | expect(lineNum).toBe(2); 170 | }); 171 | 172 | it('single byte array with multiple lines separated by \\r\\n', () => { 173 | // arrange: 174 | let lineNum = 0; 175 | const next = parse.getLines((line, fieldLength) => { 176 | ++lineNum; 177 | expect(decoder.decode(line)).toEqual(lineNum === 1 ? 'id: abc' : 'data: def'); 178 | expect(fieldLength).toEqual(lineNum === 1 ? 2 : 4); 179 | }); 180 | 181 | // act: 182 | next(encoder.encode('id: abc\r\ndata: def\r\n')); 183 | 184 | // assert: 185 | expect(lineNum).toBe(2); 186 | }); 187 | }); 188 | 189 | describe('getMessages', () => { 190 | it('happy path', () => { 191 | // arrange: 192 | let msgNum = 0; 193 | const next = parse.getMessages(id => { 194 | expect(id).toEqual('abc'); 195 | }, retry => { 196 | expect(retry).toEqual(42); 197 | }, msg => { 198 | ++msgNum; 199 | expect(msg).toEqual({ 200 | retry: 42, 201 | id: 'abc', 202 | event: 'def', 203 | data: 'ghi' 204 | }); 205 | }); 206 | 207 | // act: 208 | next(encoder.encode('retry: 42'), 5); 209 | next(encoder.encode('id: abc'), 2); 210 | next(encoder.encode('event:def'), 5); 211 | next(encoder.encode('data:ghi'), 4); 212 | next(encoder.encode(''), -1); 213 | 214 | // assert: 215 | expect(msgNum).toBe(1); 216 | }); 217 | 218 | it('skip unknown fields', () => { 219 | let msgNum = 0; 220 | const next = parse.getMessages(id => { 221 | expect(id).toEqual('abc'); 222 | }, _retry => { 223 | fail('retry should not be called'); 224 | }, msg => { 225 | ++msgNum; 226 | expect(msg).toEqual({ 227 | id: 'abc', 228 | data: '', 229 | event: '', 230 | retry: undefined, 231 | }); 232 | }); 233 | 234 | // act: 235 | next(encoder.encode('id: abc'), 2); 236 | next(encoder.encode('foo: null'), 3); 237 | next(encoder.encode(''), -1); 238 | 239 | // assert: 240 | expect(msgNum).toBe(1); 241 | }); 242 | 243 | it('ignore non-integer retry', () => { 244 | let msgNum = 0; 245 | const next = parse.getMessages(_id => { 246 | fail('id should not be called'); 247 | }, _retry => { 248 | fail('retry should not be called'); 249 | }, msg => { 250 | ++msgNum; 251 | expect(msg).toEqual({ 252 | id: '', 253 | data: '', 254 | event: '', 255 | retry: undefined, 256 | }); 257 | }); 258 | 259 | // act: 260 | next(encoder.encode('retry: def'), 5); 261 | next(encoder.encode(''), -1); 262 | 263 | // assert: 264 | expect(msgNum).toBe(1); 265 | }); 266 | 267 | it('skip comment-only messages', () => { 268 | // arrange: 269 | let msgNum = 0; 270 | const next = parse.getMessages(id => { 271 | expect(id).toEqual('123'); 272 | }, _retry => { 273 | fail('retry should not be called'); 274 | }, msg => { 275 | ++msgNum; 276 | expect(msg).toEqual({ 277 | retry: undefined, 278 | id: '123', 279 | event: 'foo ', 280 | data: '', 281 | }); 282 | }); 283 | 284 | // act: 285 | next(encoder.encode('id:123'), 2); 286 | next(encoder.encode(':'), 0); 287 | next(encoder.encode(': '), 0); 288 | next(encoder.encode('event: foo '), 5); 289 | next(encoder.encode(''), -1); 290 | 291 | // assert: 292 | expect(msgNum).toBe(1); 293 | }); 294 | 295 | it('should append data split across multiple lines', () => { 296 | // arrange: 297 | let msgNum = 0; 298 | const next = parse.getMessages(_id => { 299 | fail('id should not be called'); 300 | }, _retry => { 301 | fail('retry should not be called'); 302 | }, msg => { 303 | ++msgNum; 304 | expect(msg).toEqual({ 305 | data: 'YHOO\n+2\n\n10', 306 | id: '', 307 | event: '', 308 | retry: undefined, 309 | }); 310 | }); 311 | 312 | // act: 313 | next(encoder.encode('data:YHOO'), 4); 314 | next(encoder.encode('data: +2'), 4); 315 | next(encoder.encode('data'), 4); 316 | next(encoder.encode('data: 10'), 4); 317 | next(encoder.encode(''), -1); 318 | 319 | // assert: 320 | expect(msgNum).toBe(1); 321 | }); 322 | 323 | it('should reset id if sent multiple times', () => { 324 | // arrange: 325 | const expectedIds = ['foo', '']; 326 | let idsIdx = 0; 327 | let msgNum = 0; 328 | const next = parse.getMessages(id => { 329 | expect(id).toEqual(expectedIds[idsIdx]); 330 | ++idsIdx; 331 | }, _retry => { 332 | fail('retry should not be called'); 333 | }, msg => { 334 | ++msgNum; 335 | expect(msg).toEqual({ 336 | data: '', 337 | id: '', 338 | event: '', 339 | retry: undefined, 340 | }); 341 | }); 342 | 343 | // act: 344 | next(encoder.encode('id: foo'), 2); 345 | next(encoder.encode('id'), 2); 346 | next(encoder.encode(''), -1); 347 | 348 | // assert: 349 | expect(idsIdx).toBe(2); 350 | expect(msgNum).toBe(1); 351 | }); 352 | }); 353 | }); 354 | -------------------------------------------------------------------------------- /src/parse.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Represents a message sent in an event stream 3 | * https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events#Event_stream_format 4 | */ 5 | export interface EventSourceMessage { 6 | /** The event ID to set the EventSource object's last event ID value. */ 7 | id: string; 8 | /** A string identifying the type of event described. */ 9 | event: string; 10 | /** The event data */ 11 | data: string; 12 | /** The reconnection interval (in milliseconds) to wait before retrying the connection */ 13 | retry?: number; 14 | } 15 | 16 | /** 17 | * Converts a ReadableStream into a callback pattern. 18 | * @param stream The input ReadableStream. 19 | * @param onChunk A function that will be called on each new byte chunk in the stream. 20 | * @returns {Promise} A promise that will be resolved when the stream closes. 21 | */ 22 | export async function getBytes(stream: ReadableStream, onChunk: (arr: Uint8Array) => void) { 23 | const reader = stream.getReader(); 24 | let result: ReadableStreamDefaultReadResult; 25 | while (!(result = await reader.read()).done) { 26 | onChunk(result.value); 27 | } 28 | } 29 | 30 | const enum ControlChars { 31 | NewLine = 10, 32 | CarriageReturn = 13, 33 | Space = 32, 34 | Colon = 58, 35 | } 36 | 37 | /** 38 | * Parses arbitary byte chunks into EventSource line buffers. 39 | * Each line should be of the format "field: value" and ends with \r, \n, or \r\n. 40 | * @param onLine A function that will be called on each new EventSource line. 41 | * @returns A function that should be called for each incoming byte chunk. 42 | */ 43 | export function getLines(onLine: (line: Uint8Array, fieldLength: number) => void) { 44 | let buffer: Uint8Array | undefined; 45 | let position: number; // current read position 46 | let fieldLength: number; // length of the `field` portion of the line 47 | let discardTrailingNewline = false; 48 | 49 | // return a function that can process each incoming byte chunk: 50 | return function onChunk(arr: Uint8Array) { 51 | if (buffer === undefined) { 52 | buffer = arr; 53 | position = 0; 54 | fieldLength = -1; 55 | } else { 56 | // we're still parsing the old line. Append the new bytes into buffer: 57 | buffer = concat(buffer, arr); 58 | } 59 | 60 | const bufLength = buffer.length; 61 | let lineStart = 0; // index where the current line starts 62 | while (position < bufLength) { 63 | if (discardTrailingNewline) { 64 | if (buffer[position] === ControlChars.NewLine) { 65 | lineStart = ++position; // skip to next char 66 | } 67 | 68 | discardTrailingNewline = false; 69 | } 70 | 71 | // start looking forward till the end of line: 72 | let lineEnd = -1; // index of the \r or \n char 73 | for (; position < bufLength && lineEnd === -1; ++position) { 74 | switch (buffer[position]) { 75 | case ControlChars.Colon: 76 | if (fieldLength === -1) { // first colon in line 77 | fieldLength = position - lineStart; 78 | } 79 | break; 80 | // @ts-ignore:7029 \r case below should fallthrough to \n: 81 | case ControlChars.CarriageReturn: 82 | discardTrailingNewline = true; 83 | case ControlChars.NewLine: 84 | lineEnd = position; 85 | break; 86 | } 87 | } 88 | 89 | if (lineEnd === -1) { 90 | // We reached the end of the buffer but the line hasn't ended. 91 | // Wait for the next arr and then continue parsing: 92 | break; 93 | } 94 | 95 | // we've reached the line end, send it out: 96 | onLine(buffer.subarray(lineStart, lineEnd), fieldLength); 97 | lineStart = position; // we're now on the next line 98 | fieldLength = -1; 99 | } 100 | 101 | if (lineStart === bufLength) { 102 | buffer = undefined; // we've finished reading it 103 | } else if (lineStart !== 0) { 104 | // Create a new view into buffer beginning at lineStart so we don't 105 | // need to copy over the previous lines when we get the new arr: 106 | buffer = buffer.subarray(lineStart); 107 | position -= lineStart; 108 | } 109 | } 110 | } 111 | 112 | /** 113 | * Parses line buffers into EventSourceMessages. 114 | * @param onId A function that will be called on each `id` field. 115 | * @param onRetry A function that will be called on each `retry` field. 116 | * @param onMessage A function that will be called on each message. 117 | * @returns A function that should be called for each incoming line buffer. 118 | */ 119 | export function getMessages( 120 | onId: (id: string) => void, 121 | onRetry: (retry: number) => void, 122 | onMessage?: (msg: EventSourceMessage) => void 123 | ) { 124 | let message = newMessage(); 125 | const decoder = new TextDecoder(); 126 | 127 | // return a function that can process each incoming line buffer: 128 | return function onLine(line: Uint8Array, fieldLength: number) { 129 | if (line.length === 0) { 130 | // empty line denotes end of message. Trigger the callback and start a new message: 131 | onMessage?.(message); 132 | message = newMessage(); 133 | } else if (fieldLength > 0) { // exclude comments and lines with no values 134 | // line is of format ":" or ": " 135 | // https://html.spec.whatwg.org/multipage/server-sent-events.html#event-stream-interpretation 136 | const field = decoder.decode(line.subarray(0, fieldLength)); 137 | const valueOffset = fieldLength + (line[fieldLength + 1] === ControlChars.Space ? 2 : 1); 138 | const value = decoder.decode(line.subarray(valueOffset)); 139 | 140 | switch (field) { 141 | case 'data': 142 | // if this message already has data, append the new value to the old. 143 | // otherwise, just set to the new value: 144 | message.data = message.data 145 | ? message.data + '\n' + value 146 | : value; // otherwise, 147 | break; 148 | case 'event': 149 | message.event = value; 150 | break; 151 | case 'id': 152 | onId(message.id = value); 153 | break; 154 | case 'retry': 155 | const retry = parseInt(value, 10); 156 | if (!isNaN(retry)) { // per spec, ignore non-integers 157 | onRetry(message.retry = retry); 158 | } 159 | break; 160 | } 161 | } 162 | } 163 | } 164 | 165 | function concat(a: Uint8Array, b: Uint8Array) { 166 | const res = new Uint8Array(a.length + b.length); 167 | res.set(a); 168 | res.set(b, a.length); 169 | return res; 170 | } 171 | 172 | function newMessage(): EventSourceMessage { 173 | // data, event, and id must be initialized to empty strings: 174 | // https://html.spec.whatwg.org/multipage/server-sent-events.html#event-stream-interpretation 175 | // retry should be initialized to undefined so we return a consistent shape 176 | // to the js engine all the time: https://mathiasbynens.be/notes/shapes-ics#takeaways 177 | return { 178 | data: '', 179 | event: '', 180 | id: '', 181 | retry: undefined, 182 | }; 183 | } 184 | -------------------------------------------------------------------------------- /tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "module": "esnext", 5 | "outDir": "./lib/esm", 6 | }, 7 | "exclude": [ 8 | "src/**/*.spec.ts" 9 | ] 10 | } 11 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES2017", 4 | "module": "commonjs", 5 | "esModuleInterop": true, 6 | "forceConsistentCasingInFileNames": true, 7 | "rootDir": "src", 8 | "outDir": "lib/cjs", 9 | "declaration": true, 10 | "sourceMap": true, 11 | "skipLibCheck": true, 12 | "strict": true, 13 | "removeComments": true, 14 | "noFallthroughCasesInSwitch": true, 15 | "noUnusedLocals": true, 16 | "noUnusedParameters": true, 17 | "lib": [ 18 | "DOM", 19 | "ES2018" 20 | ] 21 | } 22 | } 23 | --------------------------------------------------------------------------------