Javascript Socketio无法正确使用Nodejs/Typescript和React

我一直在尝试让

socket.io

与我的

Nodejs和Typescript

后端和

React+JSX

前端一起工作，这是我第一次体验

socket.io

，但这是一场噩梦。 这是server.ts文件

import Express，{Application}来自“Express”；
从“dotenv”导入dotenv；
const-app:Application=Express（）；
从“http”导入http；
//从套接字io获取套接字类型
从“Socket.io”导入{Socket}；
//从单独的文件导入IO对象
从“/utils/socketio”导入{init，socket}；//{
日志（“已到达服务器”）
socket.on（“连接的”，（数据：对象）=>{
console.log（“已连接”）
//@ts忽略
socket.emit（“joined2”{
//@ts忽略
全名：“学生[0]。全名”，
出席人数：“，
平均分：“，
平均出席人数：“
})
})
})
侦听（process.env.PORT）；

后端上的SocketIO.ts文件

从“Socket.io”导入socketIo，{Socket}；
让爱娥：任何；
//@ts忽略
const init=（httpServer）=>{
//@ts忽略
io=socketIo（httpServer{
科尔斯：是的，
起源：[”http://127.0.0.1:3000"]
});
返回io；
}
常量getIO=（）=>{
如果（！io）{
抛出新错误（“Socket.io未初始化！”）；
}
返回io；
}
常量套接字=（）=>{
返回getIO（）.on（“连接”，（套接字：套接字）=>{
//log（“内部socketio.ts文件”）
返回插座；
})
}
导出{init，getIO，socket}；

这是StudentPortal.jsx文件中的

useffect

hook

useffect（（）=>{
setLoader（真）
socket.emit（“连接”）；//{
设置类（真）；
setDisableSubmit（false）；
setLoader（错误）
if（response.data.class\u data\u数组）{
setClassData（response.data.class_data_array.reverse（））；
}
});
}，[addedClass]）

最后，这是Class.jsx文件，我想在这里最终获得该事件

socket.on（“joined2”（数据）=>{
//setClassData（[…classData，data]）；
log（“Class.jsx套接字”）；
})

因此，这一点的要点是，我正在从

StudentPortal.jsx

发送一个名为

joined

的事件，并在

服务器.ts

中侦听它，在它的主体中，我正在发送另一个名为

Joined2

的事件，并在

类中侦听它。jsx

中，我尝试了许多不同的事情，将套接字连接放在不同的文件中，先尝试连接，然后尝试emmit，更何况，似乎什么都不起作用。 非常感谢您的帮助。

---

谢谢

什么不起作用？连接建立了吗？它在哪里失败。请提供更多信息以获得帮助。“它不起作用”不能解决问题。看看