Node.js实现WebSocket通信教程
你在学习文章相关的知识吗?本文《Node.js如何实现WebSocket通信》,主要介绍的内容就涉及到,如果你想提升自己的开发能力,就不要错过这篇文章,大家要知道编程理论基础和实战操作都是不可或缺的哦!
Node.js中操作WebSocket的核心是使用ws库创建服务器和客户端,通过事件驱动实现双向通信。首先安装ws库,创建HTTP服务器并绑定WebSocket服务器,监听connection事件处理客户端连接,利用message、close、error事件处理消息收发、连接关闭和错误。客户端通过new WebSocket()连接服务器,使用onopen、onmessage、onclose、onerror进行交互。数据传输通过send()发送,message事件接收,注意数据类型统一。错误处理需监听error事件,区分服务器与连接级错误;关闭事件通过close回调获取code和reason,判断关闭原因并执行重连或资源清理,确保应用健壮性。
在Node.js中操作WebSocket,我们通常会借助成熟的第三方库,最流行且功能全面的当属ws
库。它提供了一套简洁而强大的API,无论你是想搭建一个WebSocket服务器,还是构建一个WebSocket客户端,都能轻松实现实时双向通信。核心思路无非就是监听连接、处理消息、以及在适当时候关闭连接,这一切在Node.js异步非阻塞的特性下显得尤其高效。
Node.js中如何操作WebSocket,其核心在于利用ws
这样的库来创建服务器实例,监听客户端连接请求,并在连接建立后,通过事件监听器处理消息的接收与发送。这包括了设置服务器端口、定义消息处理逻辑(如on('message')
)、处理连接断开(on('close')
)和错误(on('error')
)等关键步骤。对于客户端,同样是创建WebSocket实例,指定服务器地址,然后通过类似的事件监听机制与服务器进行交互。
Node.js中搭建WebSocket服务器的基本步骤是什么?
说实话,第一次接触WebSocket的时候,总觉得它是个挺神秘的东西,毕竟和传统的HTTP请求/响应模式大相径庭。但当你真的上手用ws
库在Node.js里搭起来,会发现它其实非常直观。我个人觉得,最关键的就是理解“事件驱动”这个核心。
搭建WebSocket服务器,首先你得安装ws
库:npm install ws
。然后,代码层面大致是这样的:
const WebSocket = require('ws'); const http = require('http'); // WebSocket通常运行在HTTP服务器之上 // 创建一个HTTP服务器,WebSocket服务器可以依附于它 const server = http.createServer((req, res) => { res.writeHead(200, { 'Content-Type': 'text/plain' }); res.end('WebSocket server is running.\n'); }); // 创建WebSocket服务器实例,并绑定到HTTP服务器 const wss = new WebSocket.Server({ server }); wss.on('connection', ws => { console.log('一个新的客户端连接了!'); ws.on('message', message => { // 收到消息,这里可以做各种处理,比如广播给所有连接的客户端 console.log(`收到消息: ${message}`); // 假设我们只是把收到的消息原封不动地发回去 ws.send(`服务器收到你的消息: ${message}`); }); ws.on('close', () => { console.log('一个客户端断开连接了。'); }); ws.on('error', error => { console.error('WebSocket 错误:', error); }); // 连接建立后,也可以主动向客户端发送消息 ws.send('欢迎连接到我的WebSocket服务器!'); }); // 启动HTTP服务器,监听端口 const PORT = 8080; server.listen(PORT, () => { console.log(`WebSocket服务器在 http://localhost:${PORT} 上运行`); });
这段代码里,我们先创建了一个普通的HTTP服务器,这并不是必须的,但很多时候WebSocket会和HTTP服务共用端口,或者WebSocket协议握手就是基于HTTP的。然后,我们把WebSocket.Server
实例绑定到这个HTTP服务器上。wss.on('connection', ...)
是关键,每当有新的客户端连接成功,这个回调函数就会被触发,并传入一个代表该客户端连接的ws
对象。所有的消息收发、错误处理和连接关闭,都是围绕这个ws
对象进行的。
如何在Node.js WebSocket客户端与服务器之间发送和接收数据?
客户端与服务器之间的数据交换,是WebSocket的核心价值所在。在我看来,它最大的魅力就是那种“实时性”和“双向性”,感觉就像是开了一条专线,想发就发,想收就收,不用像HTTP那样每次都得“请求-响应”走一套流程。
服务器端发送和接收数据:
在上面的服务器代码中,我们已经看到了接收数据和发送数据的例子。
- 接收数据: 通过
ws.on('message', message => { ... })
监听客户端发送过来的消息。message
通常是Buffer类型,如果你发送的是文本,需要message.toString()
来转换。 - 发送数据: 通过
ws.send(data)
方法向特定的客户端发送数据。data
可以是字符串、Buffer或ArrayBuffer。
客户端发送和接收数据:
客户端的逻辑与服务器端异曲同工,也是基于事件的。你可以用浏览器内置的WebSocket
API,也可以在Node.js环境中使用ws
库作为客户端。这里以Node.js客户端为例:
const WebSocket = require('ws'); // 连接到服务器 const ws = new WebSocket('ws://localhost:8080'); ws.onopen = () => { console.log('成功连接到WebSocket服务器。'); // 连接成功后,可以立即发送消息 ws.send('你好,服务器!我是客户端。'); }; ws.onmessage = event => { // 收到服务器发送过来的消息 console.log(`收到服务器消息: ${event.data}`); // 可以在收到特定消息后,再发送一条消息 if (event.data.includes('欢迎')) { setTimeout(() => { ws.send('服务器,我收到你的欢迎了!'); }, 1000); } }; ws.onerror = error => { console.error('WebSocket客户端错误:', error); }; ws.onclose = () => { console.log('与服务器的连接已关闭。'); }; // 模拟一段时间后客户端主动关闭连接 setTimeout(() => { if (ws.readyState === WebSocket.OPEN) { ws.close(); console.log('客户端主动关闭连接。'); } }, 5000);
这里需要注意event.data
,它直接包含了服务器发送过来的数据。无论是服务器还是客户端,发送的数据类型最好保持一致,或者在接收端做好类型转换和解析工作,比如约定好都发送JSON字符串,然后JSON.parse()
。这种数据格式的统一,是保证通信顺畅的关键。
Node.js WebSocket连接中如何处理错误和关闭事件?
处理错误和连接关闭,这绝对是构建任何健壮网络应用不可或缺的一环。在我做项目的时候,早期总是把重心放在“功能实现”上,而对异常处理考虑不足,结果线上环境一出问题就抓瞎。后来才明白,优雅地处理异常和关闭,才是区分一个玩具项目和生产级应用的标志。
错误处理 (ws.on('error', ...)
):
无论是服务器还是客户端,error
事件都至关重要。它会在网络问题、协议解析错误、或者其他底层错误发生时被触发。
在服务器端:
wss.on('connection', ws => { // ... 其他事件监听 ... ws.on('error', error => { // 捕获特定客户端连接的错误 console.error('单个客户端连接错误:', error.message); // 这里可以记录日志,或者尝试关闭这个有问题的连接 // ws.terminate(); // 强制关闭,不发送任何关闭帧 }); }); wss.on('error', error => { // 捕获整个WebSocket服务器的错误,比如端口被占用等 console.error('WebSocket服务器全局错误:', error.message); // 对于服务器全局错误,可能需要重启服务或者报警 });
针对单个ws
实例的错误,通常是该连接自身的问题。而wss
(WebSocket服务器)实例上的错误,则可能是更全局性的问题,比如服务器启动失败。
在客户端:
ws.onerror = error => { console.error('WebSocket客户端连接错误:', error); // 客户端错误可能意味着连接失败、断开,或者数据传输问题 // 此时可以尝试重连,或者通知用户连接异常 };
客户端的错误处理同样重要,它决定了你的应用在网络不稳定或服务器故障时,能否给出友好的提示或进行自动恢复。
关闭事件 (ws.on('close', ...)
/ ws.onclose
):
连接的关闭是正常生命周期的一部分,但它也可能因为异常而发生。理解关闭事件的code
和reason
非常有用。
在服务器端:
wss.on('connection', ws => { // ... ws.on('close', (code, reason) => { console.log(`客户端连接关闭。Code: ${code}, Reason: ${reason ? reason.toString() : '无'}`); // code 是一个数字,表示关闭的原因,比如 1000 表示正常关闭 // reason 是一个可选的字符串,提供更多细节 // 可以在这里清理与该客户端相关的资源,比如从活跃连接列表中移除 }); });
在客户端:
ws.onclose = event => { console.log(`与服务器的连接已关闭。Code: ${event.code}, Reason: ${event.reason}`); // event.code 和 event.reason 与服务器端类似 // 根据关闭码判断是否需要自动重连,例如: if (event.code !== 1000) { // 1000是正常关闭 console.log('连接异常关闭,尝试重连...'); // setTimeout(() => { /* 重新创建WebSocket连接 */ }, 3000); } };
code
有很多标准值,例如1000
表示正常关闭,1001
表示端点离开(比如浏览器页面关闭),1006
表示异常关闭(无关闭帧)。通过判断这些code
,我们可以更智能地处理连接断开后的逻辑,比如是否进行重连,或者记录日志进行分析。这种细节的处理,往往能大大提升应用的鲁棒性。
文中关于的知识介绍,希望对你的学习有所帮助!若是受益匪浅,那就动动鼠标收藏这篇《Node.js实现WebSocket通信教程》文章吧,也可关注golang学习网公众号了解相关技术文章。

- 上一篇
- JavaScript异步迭代器与Node.js流的结合方式

- 下一篇
- 蓝海搜书网址变更及登录入口更新
-
- 文章 · 前端 | 1分钟前 |
- requestAnimationFrame的作用及使用详解
- 246浏览 收藏
-
- 文章 · 前端 | 10分钟前 | column-gap text-indent 首行缩进 break-inside CSS多列文本
- CSS首行缩进设置方法详解
- 232浏览 收藏
-
- 文章 · 前端 | 16分钟前 | 性能优化 水合不匹配 水合(Hydration) 服务端渲染(SSR) 客户端渲染(CSR)
- 水合是什么?水合反应全解析
- 253浏览 收藏
-
- 文章 · 前端 | 19分钟前 | dom CSS选择器 事件委托 MutationObserver 动态选择器
- CSS无法定位动态内容?事件委托+动态选择器解决
- 350浏览 收藏
-
- 文章 · 前端 | 23分钟前 |
- JSasync/await怎么用?
- 350浏览 收藏
-
- 文章 · 前端 | 26分钟前 |
- HSL与HSLA色彩区别全解析
- 454浏览 收藏
-
- 文章 · 前端 | 36分钟前 | 布局 CSSGrid 命名区域 grid-template-areas grid-area
- CSSGrid区域命名入门教程
- 243浏览 收藏
-
- 文章 · 前端 | 39分钟前 |
- JavaScript动态模板引擎怎么实现
- 284浏览 收藏
-
- 文章 · 前端 | 41分钟前 |
- CSS相对定位与绝对定位层叠技巧
- 300浏览 收藏
-
- 文章 · 前端 | 44分钟前 |
- JS享元模式实现与共享应用解析
- 461浏览 收藏
-
- 文章 · 前端 | 44分钟前 |
- CanvasdrawImage与toDataURL使用详解
- 204浏览 收藏
-
- 文章 · 前端 | 50分钟前 | 日志记录 调试 Object.prototype.toString.call() Symbol.toStringTag 自定义对象显示
- Symbol.toStringTag自定义对象显示,调试更清晰
- 496浏览 收藏
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
- 543次学习
-
- GO语言核心编程课程
- 本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
- 516次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
- 499次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
- 484次学习
-
- PandaWiki开源知识库
- PandaWiki是一款AI大模型驱动的开源知识库搭建系统,助您快速构建产品/技术文档、FAQ、博客。提供AI创作、问答、搜索能力,支持富文本编辑、多格式导出,并可轻松集成与多来源内容导入。
- 338次使用
-
- AI Mermaid流程图
- SEO AI Mermaid 流程图工具:基于 Mermaid 语法,AI 辅助,自然语言生成流程图,提升可视化创作效率,适用于开发者、产品经理、教育工作者。
- 1120次使用
-
- 搜获客【笔记生成器】
- 搜获客笔记生成器,国内首个聚焦小红书医美垂类的AI文案工具。1500万爆款文案库,行业专属算法,助您高效创作合规、引流的医美笔记,提升运营效率,引爆小红书流量!
- 1150次使用
-
- iTerms
- iTerms是一款专业的一站式法律AI工作台,提供AI合同审查、AI合同起草及AI法律问答服务。通过智能问答、深度思考与联网检索,助您高效检索法律法规与司法判例,告别传统模板,实现合同一键起草与在线编辑,大幅提升法律事务处理效率。
- 1153次使用
-
- TokenPony
- TokenPony是讯盟科技旗下的AI大模型聚合API平台。通过统一接口接入DeepSeek、Kimi、Qwen等主流模型,支持1024K超长上下文,实现零配置、免部署、极速响应与高性价比的AI应用开发,助力专业用户轻松构建智能服务。
- 1223次使用
-
- 优化用户界面体验的秘密武器:CSS开发项目经验大揭秘
- 2023-11-03 501浏览
-
- 使用微信小程序实现图片轮播特效
- 2023-11-21 501浏览
-
- 解析sessionStorage的存储能力与限制
- 2024-01-11 501浏览
-
- 探索冒泡活动对于团队合作的推动力
- 2024-01-13 501浏览
-
- UI设计中为何选择绝对定位的智慧之道
- 2024-02-03 501浏览