Reactjs 如何将WebSocket与react和Nestjs一起使用？

我想将WebSocket用于react应用程序，并将nestjs后端与socket.io和socket.io-client一起使用

但我无法通过WebSocket在前端和后端之间建立通信

这里是我使用WebSocket的前端页面：

import React，{useState，useffect，useRef}来自“React”；
从“socket.io客户端”导入{io}；
从“react bootstrap”导入{Button}；
从'react router dom'导入{useHistory，useLocation}；
const ENDPOINT=“ws://localhost:3000/”；
const socket=io（端点）.connect（）；
警察室=（）=>{
const location=useLocation（）
const roomId=location.state.roomId
const[gameStart，setGameStart]=useState（false）；
const[response，setResponse]=useState（“”）；
useffect（（）=>{
socket.on（“gameStarted”，（）=>{
setGameStart（真）
})
socket.on（'joinedRoom'，（）=>{
控制台日志（“连接的房间”）；
})
}，[socket]）
useffect（（）=>{
emit（'joinRoom'，{name:'username'，roomId:roomId}）
}，[socket]）
const launchGame=（）=>{
控制台日志（roomId）；
emit（'startGame'，{roomId:roomId}）
}
返回(
房间
{launchGame（）}variant=“success”>开始游戏
{gameStart？truc
：选择了
}
)
}
导出默认房间

这里是我的巢门：

从“@nestjs/websockets”导入{ConnectedSocket、MessageBody、OnGatewayConnection、OnGatewayInit、SubscribeMessage、WebSocketGateway、WebSocketServer}；
从“Socket.io”导入{Socket，Server}
从“/room.service”导入{RoomService}；
从“uuid”导入{v1作为uuidv1}
@WebSocketGateway（）
导出类RoomGateway实现OnGatewayInit、OnGatewayConnection{
缔约方：阵列
公共建造商（私人客房服务：客房服务）{
}
@WebSocketServer（）
服务器：服务器；
afterInit（服务器：任意）{
console.log（服务器）；
}
@SubscribeMessage（'chatToServer'）
handleMessage（客户端：套接字，数据：{sender:string，room:string，message:string}）：void{
this.server.to（data.room.emit（'chatToClient'，data.message））；
}
@SubscribeMessage（'createRoom'）
handleCreateRoom（客户端：套接字）：无效{
常量id=uuidv1（）；
client.join（id）；
emit（'roomCreated'，{room:id}）；
}
@SubscribeMessage（'StartName'））
handleStartGame（客户端：套接字，roomId:string）：无效{
console.log（'aodzjoiajzoi'）
这个.客房服务.StartName（6）；
this.server.to（roomId.emit（'gameStarted'）；
}
@SubscribeMessage（'movePawn'）
handleMovePawn（客户：Socket，
数据：{sender:string，roomId:string，
移动：{oldX:number，oldY:number，newX:number，newY:number}）：无效{
if（this.roomService.movePawn（data.movement））{
this.server.to（data.roomId）.emit（'movePawn'，data）
}否则{
client.emit（'impossibleMove'）
}
}
@SubscribeMessage（'joinRoom'）
手关节室(
@ConnectedSocket（）客户端：套接字，
@MessageBody（）数据：{name:string，roomId:string}）：无效{
控制台日志（“连接的房间”）；
client.join（data.roomId）
emit（'joinedRoom'，data.roomId）；
this.server.to（data.roomId）.emit（'newPlayer'，data.name）；
}
handleConnection（客户端：套接字，…参数：任意[]）{
//console.log（'客户端已连接'）
}

所以我在joinRoom中的console.log在我对其进行发射时不起作用。我认为我的客户端没有连接，但我不知道为什么