Version 4.7.0
June 22, 2023
Server
Bug Fixes
Features
Support for WebTransport
The Socket.IO server can now use WebTransport as the underlying transport.
WebTransport is a web API that uses the HTTP/3 protocol as a bidirectional transport. It's intended for two-way communications between a web client and an HTTP/3 server.
References:
- https://w3c.github.io/webtransport/
- https://developer.mozilla.org/en-US/docs/Web/API/WebTransport
- https://developer.chrome.com/articles/webtransport/
Until WebTransport support lands in Node.js, you can use the @fails-components/webtransport
package:
import { readFileSync } from "fs";
import { createServer } from "https";
import { Server } from "socket.io";
import { Http3Server } from "@fails-components/webtransport";
// WARNING: the total length of the validity period MUST NOT exceed two weeks (https://w3c.github.io/webtransport/#custom-certificate-requirements)
const cert = readFileSync("/path/to/my/cert.pem");
const key = readFileSync("/path/to/my/key.pem");
const httpsServer = createServer({
key,
cert
});
httpsServer.listen(3000);
const io = new Server(httpsServer, {
transports: ["polling", "websocket", "webtransport"] // WebTransport is not enabled by default
});
const h3Server = new Http3Server({
port: 3000,
host: "0.0.0.0",
secret: "changeit",
cert,
privKey: key,
});
(async () => {
const stream = await h3Server.sessionStream("/engine.io/");
const sessionReader = stream.getReader();
while (true) {
const { done, value } = await sessionReader.read();
if (done) {
break;
}
io.engine.onWebTransportSession(value);
}
})();
h3Server.startServer();
Added in 123b68c.
Client bundles with CORS headers
The bundles will now have the right Access-Control-Allow-xxx
headers.
Added in 63f181c.
Dependencies
engine.io@~6.5.0
(diff)ws@~8.11.0
(no change)
Client
Bug Fixes
- properly report timeout error when connecting (5bc94b5)
- use same scope for setTimeout and clearTimeout calls (#1568) (f2892ab)
Features
Support for WebTransport
The Socket.IO client can now use WebTransport as the underlying transport.
WebTransport is a web API that uses the HTTP/3 protocol as a bidirectional transport. It's intended for two-way communications between a web client and an HTTP/3 server.
References:
- https://w3c.github.io/webtransport/
- https://developer.mozilla.org/en-US/docs/Web/API/WebTransport
- https://developer.chrome.com/articles/webtransport/
For Node.js clients: until WebTransport support lands in Node.js, you can use the @fails-components/webtransport
package:
import { WebTransport } from "@fails-components/webtransport";
global.WebTransport = WebTransport;
Added in 7195c0f.
Cookie management for the Node.js client
When setting the withCredentials
option to true
, the Node.js client will now include the cookies in the HTTP requests, making it easier to use it with cookie-based sticky sessions.
import { io } from "socket.io-client";
const socket = io("https://example.com", {
withCredentials: true
});
Added in 5fc88a6.
Conditional import of the ESM build with debug logs
By default, the ESM build does not include the debug
package in the browser environments, because it increases the bundle size (see 16b6569).
Which means that, unfortunately, debug logs are not available in the devtools console, even when setting the localStorage.debug = ...
attribute.
You can now import the build which includes the debug
packages with a conditional import. Example with vite:
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
export default defineConfig({
plugins: [react()],
server: {
port: 4000
},
resolve: {
conditions: ["development"]
}
})
Reference: https://v2.vitejs.dev/config/#resolve-conditions
Added in 781d753.
Dependencies
engine.io-client@~6.5.0
(diff)ws@~8.11.0
(no change)