利用webSocket实现浏览器中多个标签页之间的通信

最新推荐文章于 2024-08-30 01:35:49 发布

aweo960421621

最新推荐文章于 2024-08-30 01:35:49 发布

阅读量3.8k

点赞数

文章标签：网络 javascript 前端 ViewUI

原文链接：http://www.cnblogs.com/javascript9527/p/11350537.html

版权

本文介绍了如何利用WebSocket实现浏览器多个标签页之间的通信。WebSocket提供双向通信，便于实现实时更新，但需要服务端支持，并且大量数据交换可能增加服务器负担。文章通过搭建WebSocket服务器和展示发送、接收消息的标签页示例来阐述其实现过程。

摘要由CSDN通过智能技术生成

webSoket用来实现双向通信，客户端和服务端实时通信。

webSoket优点和缺点？

　　　　优点：对于前端来说，使用简单，功能灵活，如果部署了webSocket服务器，可以实现实时通信。

　　　　缺点：需要服务端技术的支持，如果websocket数据量比较大的话，会严重消耗服务器的资源。

例子：

01 websocket服务器端搭建

//初始化一个node项目：node init，一路确认就可以,文件夹会自动创建一个package.json文件
// 下载ws文件    npm i -save ws

//获得WebSocketServerr类型
var WebSocketServer = require('ws').Server;
//创建WebSocketServer对象实例，监听指定端口
var wss = new WebSocketServer({ port:8080 });
//创建保存所有已连接到服务器的客户端对象的数组
var clients=[];

//为服务器添加connection事件监听，当有客户端连接到服务端时，立刻将客户端对象保存进数组中
wss.on('connection', function (client) {
      console.log("一个客户端连接到服务器")
      if(clients.indexOf(client)===-1){
   //如果是首次连接
            clients.push(client) //就将当前连接保存到数组备用
            console.log("有"+clients.length+"客户端在线")
       //为每个client对象绑定message事件，当某个客户端发来消息时，自动触发
       client.on('message',function(msg){
             console.log(