React中“WebSocket is closed before the connection is established“

在 React 中你需要将它添加到你useEffect的return

js 复制代码
useEffect(() => {
 const socket = new WebSocket(address);


 return () => {
   if (socket.readyState === 1) { // <-- This is important
           socket.close();
      }
   }
}, []);

然而,这不仅仅是最好的解决方案!您需要使用钩子,而不是直接在视图/组件中使用套接字连接,它可以防止多次创建套接字连接。

此外,无论前端是否正在通信,如果套接字连接未使用,后端都应关闭该连接。

相关推荐
getapi1 天前
Express 是一个基于 Node.js 的轻量级、灵活的 Web 应用框架,广泛用于构建后端服务和 API
前端·node.js·express
渣波1 天前
🧳 我的 React Trip 之旅(5):我的 AI 聊天机器人,今天又把用户气笑了
前端·javascript
boombb1 天前
数据驱动与CSS预定义样式:实现灵活多变的Banner布局
前端
JIngJaneIL1 天前
基于Java失物招领系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot·vue
鼎道开发者联盟1 天前
当界面会思考:AIGUI八要素驱动DingOS实现“感知-生成-进化“闭环
前端·人工智能·ai·gui
豐儀麟阁贵1 天前
9.3获取字符串信息
java·开发语言·前端·算法
苦夏木禾1 天前
使用css制作一个环形进度展示圈
前端·css
by__csdn1 天前
ES6新特性全攻略:JavaScript的现代革命
开发语言·前端·javascript·typescript·ecmascript·es6·js
by__csdn1 天前
Vue 双向数据绑定深度解析:从原理到实践的全方位指南
前端·javascript·vue.js·typescript·前端框架·vue·ecmascript
奋斗吧程序媛1 天前
前端 Token 管理与最佳实践
前端·vue.js