TypeError: Cannot read properties of undefined (reading 'addPath')

[tuxiaobei-scu]

I followed the instructions in the https://socket.io/get-started/webtransport documentation to set up the server. The final code matches exactly with the code provided in the article. index.js

import { readFile } from "node:fs/promises";
import { createServer } from "node:https";
import { Server } from "socket.io";
import { Http3Server } from "@fails-components/webtransport";

const key = await readFile("./key.pem");
const cert = await readFile("./cert.pem");

const httpsServer = createServer({
  key,
  cert
}, async (req, res) => {
  if (req.method === "GET" && req.url === "/") {
    const content = await readFile("./index.html");
    res.writeHead(200, {
      "content-type": "text/html"
    });
    res.write(content);
    res.end();
  } else {
    res.writeHead(404).end();
  }
});

const port = process.env.PORT || 3000;

httpsServer.listen(port, () => {
  console.log(`server listening at https://localhost:${port}`);
});

const io = new Server(httpsServer, {
  transports: ["polling", "websocket", "webtransport"]
});

io.on("connection", (socket) => {
  console.log(`connected with transport ${socket.conn.transport.name}`);

  socket.conn.on("upgrade", (transport) => {
    console.log(`transport upgraded to ${transport.name}`);
  });

  socket.on("disconnect", (reason) => {
    console.log(`disconnected due to ${reason}`);
  });
});

const h3Server = new Http3Server({
  port,
  host: "0.0.0.0",
  secret: "changeit",
  cert,
  privKey: key,
});

(async () => {
  const stream = await h3Server.sessionStream("/socket.io/");
  const sessionReader = stream.getReader();

  while (true) {
    const { done, value } = await sessionReader.read();
    if (done) {
      break;
    }
    io.engine.onWebTransportSession(value);
  }
})();

h3Server.startServer();

package.json

{
  "name": "webtransport-sample-project",
  "version": "0.0.1",
  "description": "Socket.IO with WebTransport",
  "private": true,
  "type": "module",
  "dependencies": {
    "@fails-components/webtransport": "^0.3.1",
    "socket.io": "^4.7.2"
  }
}

However, I am unable to run the code successfully.

> node index.js
server listening at https://localhost:3000
file:///opt/webtransport-sample-project/node_modules/@fails-components/webtransport/lib/server.js:105
      this.transportInt.addPath(path)
                        ^

TypeError: Cannot read properties of undefined (reading 'addPath')
    at Http3Server.sessionStream (file:///opt/webtransport-sample-project/node_modules/@fails-components/webtransport/lib/server.js:105:25)
    at file:///opt/webtransport-sample-project/index.js:56:33
    at file:///opt/webtransport-sample-project/index.js:66:3

Node.js v20.10.0

I tried to run it on two separate servers with Node.js versions v18.19.0 and v20.10.0, but encountered issues on both. I appreciate any assistance. Thank you.

[martenrichter]

And which version are you using?

[tuxiaobei-scu]

And which version are you using?

"@fails-components/webtransport": "^0.3.1", "socket.io": "^4.7.2"

[martenrichter]

I see 0.3.1...

[martenrichter]

I think I have seen this before on my code. I am not sure, but I do not know, if I only wrote a workaround in the app https://github.com/fails-components/avsrouter/commit/aa38677fa9db93c5e5d4f98e201e80c1d095fb92 or if it is already fixed in git (do not use the current development in Github, as I am restructuring much of the code in the moment). The problem is that the transport necessary for adding a path is only available after the server is started. So moving the code in the async after startServer should fix this. I try to remember the issue; if it is not already fixed, I will fix it after code restructuring.

[tuxiaobei-scu]

我想我以前在我的代码上看到过这一点。我不确定，但我不知道，如果我只在应用程序中编写了解决方法 fails-components/avsrouter@aa38677 或者它是否已经在 git 中修复（不要使用 Github 中的当前开发，因为我目前正在重组大部分代码）。问题在于，添加路径所需的传输仅在服务器启动后才可用。因此，在 startServer 之后移动异步中的代码应该可以解决此问题。我试着记住这个问题;如果还没有修复，我会在代码重组后修复它。

Thanks! Moving the code after startServer solved the issue.