无需 Socket.io，用 TypeScript 构建 WebSocket 服务器

本文分享在没有 Socket.io 的情况下使用 TypeScript 构建 WebSocket 服务器。

项目设置

首先设置项目。导航到项目目录，使用 npm 初始化一个新的 Node.js 项目：

npm init -y

安装必要的依赖项：

npm install ws express @types/express @types/ws

初始化 TypeScript 配置：

npx tsc --init

打开生成的 tsconfig.json 文件，将 rootDir 调整为 "src"，outDir 调整为 "dist"：

{ 
  "compilerOptions" :  { 
    "rootDir" :  "src" , 
    "outDir" :  "dist" , 
    "target" :  "es6" , 
    "module" :  "commonjs" , 
    "strict" :  true , 
    "esModuleInterop" :  true
   } 
}

设置 WebSocket 服务器

现在项目已经建立，让我们来创建 WebSocket 服务器。在 src 目录中新建一个名为 index.ts 的文件，并粘贴以下代码：

import http from "http";
import { WebSocket, WebSocketServer } from "ws";
import crypto from "crypto";

const server = http.createServer((req, res) => {
  res.end("WebSocket server is active");
}).listen(3333, () => console.log("Server running on http://localhost:3333"));

type UserMessage = {
  userId: string;
  username?: string;
  message: string;
  createdAt: Date;
};

const userMessages: UserMessage[] = [];

const wss = new WebSocketServer({ server });

wss.on("connection", (ws) => {
  ws.on("error", (err) => console.error(err));

  console.log("Total connected users: ", wss.clients.size);

  ws.on("message", (data) => {
    const userData: UserMessage = {
      userId: crypto.randomBytes(16).toString("hex"),
      message: data.toString("utf-8"),
      createdAt: new Date(),
    };

    userMessages.push(userData);

    wss.clients.forEach((client: WebSocket) => {
      if (client.readyState === WebSocket.OPEN) {
        client.send(JSON.stringify(userMessages));
      }
    });
  });

  ws.send(JSON.stringify(userMessages));
});