Replace XMLHttpRequest with fetch
#4980
Labels
enhancement
New feature or request
Milestone
Comments
|
We could indeed provide another implementation for the HTTP long-polling transport, something like: import { io } from "socket.io-client";
const socket = io({
transports: [
PollingWithFetch,
WebSocket
]
});Related: socketio/engine.io-client#716 |
darrachequesne
added a commit
to socketio/engine.io-client
that referenced
this issue
Apr 23, 2024
Usage:
```js
import { Socket, transports, Fetch } from "engine.io-client";
transports.polling = Fetch;
const socket = new Socket("https://example.com");
```
Note: tree-shaking unused transports is not currently supported and
will be added later.
Related:
- socketio/socket.io#4980
- #716
darrachequesne
added a commit
to socketio/engine.io-client
that referenced
this issue
May 31, 2024
This commit adds the ability to provide a list of transport
implementations to use when connecting to an Engine.IO server.
This can be used to use HTTP long-polling based on `fetch()`, instead
of the default implementation based on the `XMLHttpRequest` object.
```
import { Socket, Fetch, WebSocket } from "engine.io-client";
const socket = new Socket({
transports: [Fetch, WebSocket]
});
```
This is useful in some environments that do not provide a
`XMLHttpRequest` object, like Chrome extension background scripts.
> XMLHttpRequest() can't be called from a service worker, extension or
otherwise. Replace calls from your background script to
XMLHttpRequest() with calls to global fetch().
Source: https://developer.chrome.com/docs/extensions/develop/migrate/to-service-workers#replace-xmlhttprequest
Related:
- #716
- socketio/socket.io#4980
This is also useful when running the client with Deno or Bun, as it
allows to use the built-in `fetch()` method and `WebSocket` object,
instead of using the `xmlhttprequest-ssl` and `ws` Node.js packages.
Related: socketio/socket.io-deno#12
This feature also comes with the ability to exclude the code related to
unused transports (a.k.a. "tree-shaking"):
```js
import { SocketWithoutUpgrade, WebSocket } from "engine.io-client";
const socket = new SocketWithoutUpgrade({
transports: [WebSocket]
});
```
In that case, the code related to HTTP long-polling and WebTransport
will be excluded from the final bundle.
Related: socketio/socket.io#4393
|
For future readers: You can now provide an array of transport implementations: import { io } from "socket.io-client";
import { Fetch, WebSocket } from "engine.io-client";
const socket = io({
transports: [Fetch, WebSocket]
});Reference: https://socket.io/docs/v4/client-options/#transports Implemented in socketio/engine.io-client@b11763b and socketio/engine.io-client@f4d898e, included in |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Is your feature request related to a problem? Please describe.
Currently, socket.io can't be used in Chrome extension background script, since modern Manifest V3 extensions are using service worker as a background script (which doesn't have
XMLHttpRequest, onlyfetch).Example error:
Describe the solution you'd like
Replacing
XMLHttpRequestwith modernfetch.Describe alternatives you've considered
I think using
transports: ['websocket'],would help, but that way I can't useextraHeaderswhich I use for authorization.Additional context
The text was updated successfully, but these errors were encountered: