socketio_typesafe_server_with_typed_events_and_socket_data.ts

1import { Server } from "socket.io";
2
3// Define the shape of the data for each event
4interface ServerToClientEvents {
5  noArg: () => void;
6  basicEmit: (a: number, b: string, c: Buffer) => void;
7  withAck: (d: string, callback: (e: number) => void) => void;
8}
9
10interface ClientToServerEvents {
11  hello: () => void;
12}
13
14interface InterServerEvents {
15  ping: () => void;
16}
17
18interface SocketData {
19  name: string;
20  age: number;
21}
22
23// Initialize the server with types
24const io = new Server<
25  ClientToServerEvents,
26  ServerToClientEvents,
27  InterServerEvents,
28  SocketData
29>();
30
31io.on("connection", (socket) => {
32  // 'hello' event is inferred from ClientToServerEvents
33  socket.on("hello", () => {
34    console.log("received hello");
35  });
36
37  // 'basicEmit' event is inferred from ServerToClientEvents
38  socket.emit("basicEmit", 1, "2", Buffer.from([3]));
39
40  // 'withAck' event is inferred from ServerToClientEvents
41  socket.emit("withAck", "4", (e) => {
42    // e is inferred as number
43    console.log(e);
44  });
45
46  // Accessing typed socket data
47  socket.data.name = "John";
48  socket.data.age = 42;
49});
50
51io.listen(3000);