Nodejs Nestjs实时通信插件@nestjs/websockets的使用

Nodejs Nestjs实时通信插件@nestjs/websockets的使用
[@nestjs](/user/nestjs)/websockets 是 NestJS 提供的一个用于处理 WebSocket 通信的模块。它基于 socket.io，可以轻松地实现客户端和服务器之间的实时通信。

安装

首先，你需要安装必要的依赖包：

npm install [@nestjs](/user/nestjs)/websockets socket.io

创建 WebSocket 服务

创建一个 WebSocket 服务来处理连接、断开连接和消息事件。这里是一个简单的例子：

import { OnModuleInit, OnModuleDestroy } from '[@nestjs](/user/nestjs)/common';
import { SubscribeMessage, WebSocketGateway, WebSocketServer } from '[@nestjs](/user/nestjs)/websockets';
import { Server, Socket } from 'socket.io';

@WebSocketGateway()
export class ChatGateway implements OnModuleInit, OnModuleDestroy {
  @WebSocketServer() server: Server;

  async onModuleInit() {
    console.log('ChatGateway initialized');
  }

  async onModuleDestroy() {
    console.log('ChatGateway destroyed');
  }

  @SubscribeMessage('events')
  handleEvents(client: Socket, data: any) {
    return 'Hello world!';
  }

  @SubscribeMessage('msgToServer')
  handleMsgFromClient(client: Socket, payload: string): void {
    this.server.emit('msgToClient', `${client.id}: ${payload}`);
  }
}

注册 WebSocket 服务

在你的模块中注册这个服务：

import { Module } from '[@nestjs](/user/nestjs)/common';
import { ChatGateway } from './chat.gateway';

@Module({
  imports: [],
  controllers: [],
  providers: [ChatGateway],
})
export class AppModule {}

客户端连接

客户端可以通过以下方式连接到 WebSocket 服务器：

const io = require('socket.io-client');
const socket = io('http://localhost:3000');

socket.on('connect', () => {
  console.log('Connected to server');
});

socket.emit('msgToServer', 'Hello Server!');

socket.on('msgToClient', (data) => {
  console.log(data);
});

更多功能

  • 房间（Rooms）：你可以将客户端分配到不同的房间，以便向特定的客户端组发送消息。
  • 命名空间（Namespaces）：你可以创建多个命名空间，每个命名空间都有自己的事件处理器。
  • 中间件（Middleware）：你可以添加中间件来处理连接前的操作。

示例：使用房间

@WebSocketGateway()
export class ChatGateway implements OnModuleInit, OnModuleDestroy {
  @WebSocketServer() server: Server;

  handleConnection(client: Socket) {
    client.join('room1');
  }

  @SubscribeMessage('events')
  handleEvents(client: Socket, data: any) {
    this.server.to('room1').emit('events', data);
  }
}

客户端加入房间后，可以接收特定房间的消息：

socket.join('room1');
socket.on('events', (data) => {
  console.log(data);
});

这样，你就有了一个基本的 NestJS WebSocket 应用程序，它可以处理基本的实时通信需求。


3 回复

当然，让我们用点幽默来聊聊@nestjs/websockets这个插件吧！想象一下，你正在举办一个派对，而你的朋友们就是客户端，你想让他们随时都能接收到最新的音乐列表（数据更新）。这时候，@nestjs/websockets就像是你家里的对讲机系统，让你可以即时广播信息给所有朋友。

首先，你需要安装@nestjs/websockets和WebSocket服务器，比如socket.io。接着，在你的NestJS应用中创建一个WebSocketGateway，这就像设置了一个超级对讲机中心。然后，你可以用@SubscribeMessage装饰器来监听特定事件，这相当于设置了监听按钮，一有新消息就通知你。

最后，当你想向所有连接的客户端发送消息时，只需调用this.server.emit，就像按下对讲机上的通话按钮，所有朋友都会立刻听到你的声音（收到消息）！

这样，你就有了一个实时通信的派对系统啦！


@nestjs/websockets 是一个在 NestJS 框架中用于实现 WebSocket 实时通信的强大工具。WebSocket 允许服务器主动向客户端推送数据，这在构建实时应用（如聊天应用、在线游戏或实时通知系统）时非常有用。

下面是一个简单的例子来展示如何在 NestJS 中使用 @nestjs/websockets 插件：

1. 安装依赖

首先确保安装了必要的依赖包：

npm install @nestjs/websockets socket.io

2. 创建 WebSocket Gateway

接下来创建一个 WebSocket 网关。你可以通过运行以下命令生成：

nest generate gateway chat

这将创建一个名为 chat.gateway.ts 的文件。这个文件定义了处理 WebSocket 连接和消息的方法。

3. 编写 WebSocket 网关逻辑

在 chat.gateway.ts 文件中，我们将编写基本的连接和消息处理逻辑：

import { WebSocketGateway, WebSocketServer } from '@nestjs/websockets';
import { Server, Socket } from 'socket.io';

@WebSocketGateway()
export class ChatGateway {
  @WebSocketServer() server: Server;

  handleConnection(client: Socket) {
    console.log(`Client connected: ${client.id}`);
  }

  handleDisconnect(client: Socket) {
    console.log(`Client disconnected: ${client.id}`);
  }

  handleMessage(client: Socket, message: string) {
    console.log(`Message received: ${message}`);
    this.server.emit('response', `Echo: ${message}`); // 向所有客户端广播消息
  }
}

4. 在主应用模块中注册网关

在你的主应用模块（通常是 app.module.ts）中导入并注册 ChatGateway：

import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { ChatGateway } from './chat.gateway';

@Module({
  imports: [],
  controllers: [AppController],
  providers: [AppService, ChatGateway],
})
export class AppModule {}

5. 客户端连接与发送消息

客户端可以使用任何支持 WebSocket 的库进行连接。这里是一个简单的 HTML 和 JavaScript 示例：

<!DOCTYPE html>
<html>
<head>
  <title>WebSocket Client</title>
</head>
<body>
  <input id="messageInput" type="text" placeholder="Type a message...">
  <button onclick="sendMessage()">Send</button>
  <div id="messages"></div>

  <script>
    const socket = new WebSocket('ws://localhost:3000');
    
    socket.onopen = () => console.log('Connected to server');

    socket.onmessage = (event) => {
      document.getElementById('messages').innerHTML += `<p>${event.data}</p>`;
    };

    function sendMessage() {
      const input = document.getElementById('messageInput') as HTMLInputElement;
      socket.send(input.value);
      input.value = '';
    }
  </script>
</body>
</html>

以上就是使用 NestJS 和 @nestjs/websockets 创建 WebSocket 服务的基本步骤。你可以根据实际需求扩展更多的功能，比如房间管理、用户认证等。

[@nestjs](/user/nestjs)/websockets 是 NestJS 提供的用于处理 WebSocket 通信的插件。它支持多种 WebSocket 实现，如 Socket.IO。以下是一个简单的使用示例：

  1. 安装依赖：

    npm install [@nestjs](/user/nestjs)/websockets socket.io

  2. 创建 WebSocket 服务：

    import { WebSocketGateway, WebSocketServer } from '[@nestjs](/user/nestjs)/websockets';
import { Server, Socket } from 'socket.io';

[@WebSocketGateway](/user/WebSocketGateway)()
export class ChatGateway {
  @WebSocketServer() server: Server;

  handleConnection(client: Socket) {
    console.log('A user connected');
  }

  handleDisconnect(client: Socket) {
    console.log('A user disconnected');
  }

  sendMessage(client: Socket, message: string) {
    this.server.emit('message', message);
  }
}

  3. 配置模块：

    import { Module } from '[@nestjs](/user/nestjs)/common';
import { ChatGateway } from './chat.gateway';

[@Module](/user/Module)({
  providers: [ChatGateway],
})
export class AppModule {}

这样就设置好了一个简单的 WebSocket 服务，可以实现客户端和服务器之间的实时通信。

回到顶部