版本 4.7.0

2023 年 6 月 22 日

服务器

错误修复

• 从 socket.data 类型中删除 Partial 修饰符 (#4740) (e5c62ca)

功能

支持 WebTransport

Socket.IO 服务器现在可以使用 WebTransport 作为底层传输。

WebTransport 是一个 Web API，它使用 HTTP/3 协议作为双向传输。它旨在用于 Web 客户端和 HTTP/3 服务器之间的双向通信。

参考资料

• https://w3c.github.io/webtransport/
• https://mdn.org.cn/en-US/docs/Web/API/WebTransport
• https://developer.chrome.com/articles/webtransport/

在 WebTransport 支持落地之前 在 Node.js 中，您可以使用 @fails-components/webtransport 包

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();

在 123b68c 中添加。

带有 CORS 标头的客户端捆绑包

这些捆绑包现在将具有正确的 Access-Control-Allow-xxx 标头。

在 63f181c 中添加。

依赖项

• engine.io@~6.5.0 (diff)
• ws@~8.11.0 (无变化)

客户端

错误修复

• 在连接时正确报告超时错误 (5bc94b5)
• 对 setTimeout 和 clearTimeout 调用使用相同的范围 (#1568) (f2892ab)

功能

支持 WebTransport

Socket.IO 客户端现在可以使用 WebTransport 作为底层传输。

WebTransport 是一个 Web API，它使用 HTTP/3 协议作为双向传输。它旨在用于 Web 客户端和 HTTP/3 服务器之间的双向通信。

参考资料

• https://w3c.github.io/webtransport/
• https://mdn.org.cn/en-US/docs/Web/API/WebTransport
• https://developer.chrome.com/articles/webtransport/

对于 Node.js 客户端：在 WebTransport 支持落地之前 在 Node.js 中，您可以使用 @fails-components/webtransport 包

import { WebTransport } from "@fails-components/webtransport";

global.WebTransport = WebTransport;

在 7195c0f 中添加。

Node.js 客户端的 Cookie 管理

将 withCredentials 选项设置为 true 时，Node.js 客户端现在将在 HTTP 请求中包含 Cookie，使其更易于与基于 Cookie 的粘性会话一起使用。

import { io } from "socket.io-client";

const socket = io("https://example.com", {
  withCredentials: true
});

在 5fc88a6 中添加。

带有调试日志的 ESM 构建的条件导入

默认情况下，ESM 构建不会在浏览器环境中包含 debug 包，因为它会增加捆绑包大小（参见 16b6569）。

这意味着，不幸的是，即使设置了 localStorage.debug = ... 属性，调试日志也无法在开发者工具控制台中使用。

您现在可以使用 条件导入 导入包含 debug 包的构建。使用 vite 的示例

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  server: {
    port: 4000
  },
  resolve: {
    conditions: ["development"]
  }
})

参考：https://v2.vitejs.dev/config/#resolve-conditions

在 781d753 中添加。

依赖项

• engine.io-client@~6.5.0 (diff)
• ws@~8.11.0 (无变化)