WebSocket之socket.io的基本使用

本文介绍了Socket.IO库在实现低延迟、双向通信中的作用，它基于WebSocket并提供回退机制。通过示例展示了如何安装、设置服务器和客户端，进行消息推送和接收。此外，还讲解了如何广播消息给所有用户，以及处理用户断开连接的事件。最后，通过一个远程拖拽的例子进一步说明了Socket.IO的实时交互能力。

Socket.IO 是一个WebSocket库，可以在客户端和服务器之间实现低延迟、双向和基于事件的通信。它建立在 WebSocket 协议之上，并提供额外的保证，例如回退到 HTTP 长轮询或自动重新连接。

基本使用

安装socket.io

yarn add socket.io

新建js文件与html文件内容如下

var http = require('http');
var io = require('socket.io');
var server = http.createServer((req,res)=>{
});
server.listen(2183);
// 监听 connection
io.listen(server).on('connection',(user)=>{
	setInterval(()=>{
		user.emit('test','哥们我主动来了'+Math.random());
	},1000);
});

<!doctype html> 
<html> 
<head> 
    <meta charset="utf-8">
    // 引用脚本，固定写法
    <script type="text/javascript" src='http://localhost:2183/%3C/code%3E%3C/pre%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%20%20%20%20%20%20%20%20%3C/div%3E%20%20%20%20%3C/article%3E%20%20%3Cscript%3E%20%20%20%20$(function()%20%7B%20%20%20%20%20%20setTimeout(function%20()%20%7B%20%20%20%20%20%20%20%20var%20mathcodeList%20=%20document.querySelectorAll('.htmledit_views img.mathcode');
        if (mathcodeList.length > 0) {
          for (let i = 0; i < mathcodeList.length; i++) {
            if (mathcodeList[i].complete) {
              if (mathcodeList[i].naturalWidth === 0 || mathcodeList[i].naturalHeight === 0) {
                var alt = mathcodeList[i].alt;
                alt = '\\(' + alt + '\\)';
                var curSpan = $('');
                curSpan.text(alt);
                $(mathcodeList[i]).before(curSpan);
                $(mathcodeList[i]).remove();
              }
            } else {
              mathcodeList[i].onerror = function() {
                var alt = mathcodeList[i].alt;
                alt = '\\(' + alt + '\\)';
                var curSpan = $('');
                curSpan.text(alt);
                $(mathcodeList[i]).before(curSpan);
                $(mathcodeList[i]).remove();
              };
            }
          }
          MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
        }
      }, 500)
    });


        
            
                      
                        
                        最低0.47元/天 解锁文章
                          
                      
            
        

  
  
   
      
      
        确定要放弃本次机会？
      
      福利倒计时
      
        
        :
        
        :
        
      
      
        
          
          立减 ¥
          
        
        普通VIP年卡可用
      
      立即使用
  

    
      
        
            
              
                
                  琢鸣
                
              
            
            
                关注
              关注
            
        
        
          
            
              
                
                
                
                
                    13
                
              
              点赞
            
            
              
                
                
                
              
              踩
            
            
              
                
                
                
                
                    25
                
              
              
                
                  
                    收藏
                  
                
              
              
                
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
              
            
            
              
                
                
              
                
                
                
                    4
                
              
              评论
            
            
              
                
                分享
              
                
                
                  
                    复制链接
                  
                  
                    分享到 QQ
                  
                  
                    分享到新浪微博
                  
                  
                    
                    
                      扫一扫
                    
                  
                
              
            
                
                  
                    
                    打赏
                  
                  打赏
                
          
            
              
              
            
            
              
                    
                      
                      打赏
                    
                
                  
                  举报
                
              
              
                
                  
                  举报
                
              
            
          
        
      
      
            
                专栏目录
          






                

	
		
			
				
					使用Socket.io实现网络通信（JavaScript）
				
			
			
				
					ZuqCloud的博客
				
				
					09-29
					
					1554
					
				
			
		
		
			
				Socket.io是一个基于事件驱动的实时网络通信库，它可以在客户端和服务器之间建立持久连接，使得实时数据传输变得简单而高效。本文将介绍如何使用Socket.io在JavaScript中实现网络通信，并提供相应的源代码示例。在使用Socket.io之前，我们需要在服务器端和客户端分别安装Socket.io。当启动服务器并打开客户端页面时，多个客户端之间可以实时通信，并将消息显示在消息列表中。在客户端，我们需要在HTML文件中引入Socket.io的客户端库，可以通过CDN引入，也可以将其下载到本地并引入。
			
		
	

                
            
              

	
		
			
				
					WebSocket实时通信：Socket.io
				
			
			
				
					zimin的专栏
				
				
					10-16
					
					1451
					
				
			
		
		
			
				随着Node.js Current版本24.10.0的发布（于2025年10月11日发布，由@targos等贡献）和LTS版本22.20.0 'Jod’的稳定支持，Socket.io的最新版本4.8.1（于2024年10月25日发布）继续主导实时库市场。 这个版本引入了自定义传输实现和tryAllTransports选项，提升了连接可靠性，并优化了与Node 24的兼容，如更好的异步处理。 本文将引入Socket.io，详解事件监听/发射、聊天室示例和心跳机制。我们将结合历史演进、代码示例、性能分析和202
			
		
	

              

  
      
          4 条评论
        您还未登录，请先
        登录
        后发表或查看评论
      
  
              
                

	
		
			
				
					「JavaScript深入」Socket.IO：基于 WebSocket 的实时通信库
				
			
			
				
					XH_jing的博客
				
				
					03-20
					
					2411
					
				
			
		
		
			
				Socket.IO 作为 WebSocket 的增强版本，在实时通信领域具有广泛的应用。它提供了事件驱动、自动回退、广播机制等功能，使其在即时聊天、协作编辑、多人游戏等场景中表现出色。如果需要低功耗 IoT 设备通信，可以考虑 MQTT；如果是高效的音视频通信，WebRTC 是更好的选择。不同的应用场景需要选择合适的实时通信技术，以保证系统的稳定性和性能。
			
		
	


	
		
			
				
					pg_mooncake性能优化技巧：文件统计和跳过技术的10个最佳实践
					最新发布
				
			
			
				
					gitblog_00016的博客
				
				
					05-16
					
					646
					
				
			
		
		
			
				pg_mooncake是一款基于PostgreSQL的实时分析工具，通过优化文件统计和数据跳过技术，显著提升查询性能。本文将分享10个实用的性能优化最佳实践，帮助你充分发挥pg_mooncake的实时分析能力。

## 1. 启用统计信息自动收集
pg_mooncake提供了强大的统计信息收集机制，通过定期更新表和列的统计数据，优化查询执行计划。建议在配置文件中启用自动统计收集功能，确保分析引擎始
			
		
	

		
			
		

	
		
			
				
					从入门到精通：socket.io全面解析！
				
			
			
				
					m0_72410588的博客
				
				
					08-15
					
					9751
					
				
			
		
		
			
				socket.io 是一个基于事件驱动的实时通信库，可以在浏览器和服务器之间建立持久连接，使得双向实时通信成为可能。它为开发者提供了简单易用的 API，支持跨平台、跨浏览器的实时通信。通过本文的学习，我们了解了 socket.io 的基本概念、使用方法和原理。socket.io 不仅简化了实时通信的开发工作，而且具备跨平台、跨浏览器的优势，是构建现代网络应用的重要工具之一。希望本文对读者在全栈开发中使用 socket.io 起到了一定的帮助作用。socket.io 官方文档。
			
		
	


	
		
			
				
					JS_socket.io简单使用
				
			
			
				
					小歪博客
				
				
					09-14
					
					1706
					
				
			
		
		
			
				JS_socket.io简单使用
			
		
	


	
		
			
				
					Socket.io 与 WebSocket
				
			
			
				
					sorrowkaka的博客
				
				
					09-25
					
					1861
					
				
			
		
		
			
				背景
工作上需要做一个实时投票系统，因此想到利用 websocket 做数据推送，而后台采用 nodejs 因为需要快速搭建完成该项工作，最终查找到 socket.io 这个 node 库。
而我开发工作一直集中在后台身份验证和前端页面的图表展示，对于 socket.io 本身没有太过关注内部实现，唯一一次关注是在 ios 4.x 系统接收不到 socket.io 的推送是查了一下，后发现 ios...
			
		
	


	
		
			
				
					websocket与socket.io比较与分析
				
			
			
				
					xiaojax的博客
				
				
					04-07
					
					7847
					
				
			
		
		
			
				大家参与的项目里多少都会有web server与browser需要长连接互联的场景，当然我也是，之前没有进行太多方案的调研（比如深入理解通信协议和通用的一些解决方案），所以websocket就不假思索地直接用了，包括去年写的框架xframe里也是直接嵌入了官方websocket的library来实现的。
两周前遇到个场景，前端大佬提需求说能否支持socket.io，之前写的websocket的se...
			
		
	


	
		
			
				
					Socket 、WebSocket、Socket.IO详细对比
				
			
			
				
					chaixinke的专栏
				
				
					03-17
					
					1538
					
				
			
		
		
			
				Socket是一个通用的网络编程接口，用于在网络上实现进程间通信（IPC）。它是操作系统提供的底层 API，支持 TCP、UDP 等协议。Socket 是网络通信的基础，几乎所有网络通信技术（包括 WebSocket）都是基于 Socket 实现的。WebSocket是一种基于 TCP 的应用层协议，提供了全双工通信能力。它是 HTTP 协议的升级版，允许客户端和服务器在建立连接后持续通信。WebSocket 是 HTML5 标准的一部分，主要用于浏览器与服务器之间的实时通信。Socket.IO。
			
		
	


	
		
			
				
					websocket和socket.io
				
			
			
				
					weixin_42679876的博客
				
				
					08-02
					
					3893
					
				
			
		
		
			
				websocket和socket.io
			
		
	


	
		
			
				
					实时通信库之Socket.IO
				
			
			
				
					积跬步，至千里。
				
				
					04-13
					
					3629
					
				
			
		
		
			
				Socket.IO是一个基于WebSocket的实时通信库，可以在客户端和服务器之间实现低延迟, 双向和基于事件的通信，它提供了简单易用的API，使得在Web应用程序中添加实时通信功能变得非常容易。
			
		
	


	
		
			
				
					初步使用socket.io.js
					热门推荐
				
			
			
				
					qq_39432715的博客
				
				
					09-24
					
					1万+
					
				
			
		
		
			
				1.安装node.js
百度下载node.js安装文件，然后安装
2.创建项目

3.创建cmd进到项目里拉插件

拉插件
npm install socket.io
npm install express

4.粘贴代码
service.js:
var http = require("http");
var express = require("express"); //引入express
var socketIo = require("socket.io"); //引入socket.io


var a
			
		
	


	
		
			
				
					Socket.IO打造基础聊天室
				
			
			
				
					嘿嘿
				
				
					06-11
					
					2186
					
				
			
		
		
			
				01 Socket.io 简介

一个100%由 JavaScript 实现、基于Node.js的用于实时通信、跨平台的开源框架，它包括了客户端的 JavaScript 库和 服务器端的 Node.js 服务。
	实现了对于其他语言的支持，如 Java、C++、Swift。
	提供了一个与 WebSocket 类似的通用 API：


Socket.io方法与事件

【主要特点】：

（1） 可靠性（Reliability）：依赖 Engine.IO, 首先建立长轮询，然后试着升级到更好的传输方式，如 ..
			
		
	


	
		
			
				
					Node.js 和 Socket.IO 实现实时通信
				
			
			
				
					x15514104477的博客
				
				
					11-22
					
					2349
					
				
			
		
		
			
				本文章详细讲解Node.js 和 Socket.IO 实现实时通信的步骤思路，以及用极简的的代码充分的讲解了如何通信以及通信的类型
			
		
	


	
		
			
				
					什么是Socket.IO？如何使用它实现实时应用？
				
			
			
				
					有我更精彩的博客
				
				
					07-05
					
					2831
					
				
			
		
		
			
				服务器端的库（Node.js）客户端的库，这就像一个普通的JavaScript库可以在浏览器中使用Socket.IO不仅使得实时应用的开发变得相对简单，而且保障了在实际网络环境中的高可用和可靠性。它建立在WebSocket之上，同时还支持多种fallback机制（如长轮询），确保不同网络环境和设备中能够顺利工作。
			
		
	


	
		
			
				
					关于项目中websocket的socket.io客户端js库的应用
				
			
			
				
					qq_53742640的博客
				
				
					02-12
					
					2313
					
				
			
		
		
			
				Socket.IO是一个库，可用于在浏览器和服务器之间进行实时，双向和基于事件的通信。使Node.js服务器：来源 | API为浏览器（可从Node.js的也运行）一个JavaScript客户端库：来源 | API。
			
		
	


	
		
			
				
					HTTP、WebSocket和Socket.IO
				
			
			
				
					weixin_54792212的博客
				
				
					02-13
					
					1657
					
				
			
		
		
			
				Socket.IO 是一个封装了 Websocket、基于 Node 的 JavaScript 框架，包含 client 的 JavaScript 和 server 的 Node。其屏蔽了所有底层细节，让顶层调用非常简单。另外，Socket.IO 还有一个非常重要的好处。其不仅支持 WebSocket，还支持许多种轮询机制以及其他实时通信方式，并封装了通用的接口。
			
		
	


	
		
			
				
					Socket.IO学习笔记
				
			
			
				
					viljz
				
				
					01-25
					
					1139
					
				
			
		
		
			
				什么是Socket.IO
Socket.IO是一个库，可用于在浏览器和服务器之间进行实时，双向和基于事件的通信。它包括：

使Node.js服务器：来源 | API
为浏览器（可从Node.js的也运行）一个JavaScript客户端库：来源 | API

其主要特点是：
可靠性
即使存在以下情况，也会建立连接：

代理和负载平衡器。
个人防火墙和防病毒软件。

为此，它依赖于Engine.IO，该引擎首先建立长轮询连接，然后尝试升级到在侧面进行“测试”的更好传输，例如WebSocket。请参阅“ 目标”部
			
		
	


	
		
			
				
					简易聊天室代码分享 js+socket.io
				
			
			
				
					你好呀，很高兴你在看这里~
				
				
					12-15
					
					2459
					
				
			
		
		
			
				js+node+socket.io 只是单纯的代码分享哈，不算正式文章~只是单纯的代码分享哈，不算正式文章~只是单纯的代码分享哈，不算正式文章~重要的话说三遍。
			
		
	


	
		
			
				
					实时通信Socket.io的使用
				
			
			
				
					weixin_44690156的博客
				
				
					11-04
					
					3849
					
				
			
		
		
			
				Socket.IO 是一个库，可以在客户端和服务器之间实现低延迟,双向和基于事件的通信。它建立在WebSocket协议之上，并提供额外的保证，例如回退到 HTTP 长轮询或自动重新连接。