scoket.io

它适用于所有平台，浏览器或设备，并同时关注可靠性和速度

具有以下优点：

1.实时分析
将数据推送到以实时计数器，及时监听页面所有的变化，并且接收和发送给客户端数据。

2.即时通讯和聊天
Socket.IO结合node以及express实现简单的即使通讯。

3.作为服务器
可以把socket.io当成一个服务器用来传输数据

4.自动重接支持
除非另有指示，否则断开的客户端将尝试重新连接，直到服务器重新可用

安装

yarn add scoket.io

搭建基本结构（前提有node）

创建app.js文件作为服务器

//创建http服务器
var app = require('express')();
var server = require('http').Server(app);
var io = require('socket.io')(server);
//监听端口
server.listen(3002, function(){console.log('服务器正在运行。。。。');
});
//结合node中exoress来处理在静态资源
//express  处理静态资源
//吧pubilc设置静态资源
app.use(require('express').static('public'))app.get('/', function(req, res){res.redirect('./index.html')
});//express  处理静态资源
//吧pubilc设置静态资源
app.use(require('express').static('public'))app.get('/', function(req, res){res.redirect('./index.html')
});
//监听服务器运行时所发生的事件 相当于生命周期函数
io.on('connection', function(socket){// console.log('新的用户连接上来了');
}

在前端页面引入相关文件

  <!-- 引入socket.io --><script src="/socket.io/socket.io.js"></script><script src="./js/jquery-1.8.2.js"></script> //实现诸多方法需用到<script src="./js/index.js"></script> //用于处理接收方法和信息<script>var socket = io('http://localhost:3002');  //连接端口 启动服务</script>

监听聊天功能

socket.on('sendMessage',data=>{ console.log(data)io.emit('receiveMsssage',data)})

前端应也接收和回应到页面

 $('.btn').on('click',()=>{var content = $('#content').val().trim()$('#content').val('')if(!content) return alert('请输入内容')socket.emit('sendMessage',{msg:content,username:username,avatar:avatar})})socket.on('receiveMsssage',data=>{// console.log(data)if(data.username===username){$('.box-bd').append(`<div class="masseage_box"><div class="my message"><img class="avatar" src="${data.avatar}" alt=""><div class="content"><div class="bubble"><div class="bubble_cont" ><em>${data.msg}</em></div><a>▶</a> </div></div></div></div>`)}else{$('.box-bd').append(`<div class="masseage_box"><div class="other message"><img class="avatar" src="${data.avatar}" alt=""><div class="content"><div class="nickname">${data.username}</div><div class="bubble"><div class="bubble_cont"><em>${data.msg}</em></div><a>◀</a> </div></div></div></div>`)}

这里是一些socket.on和socket.emit的用法

前端

function onConnect(socket){// 发送给当前客户端socket.emit('hello', 'can you hear me?', 1, 2, 'abc');// 发送给所有客户端，除了发送者socket.broadcast.emit('broadcast', 'hello friends!');// 发送给同在 'game' 房间的所有客户端，除了发送者socket.to('game').emit('nice game', "let's play a game");// 发送给同在 'game1' 或 'game2' 房间的所有客户端，除了发送者socket.to('game1').to('game2').emit('nice game', "let's play a game (too)");// 发送给同在 'game' 房间的所有客户端，包括发送者io.in('game').emit('big-announcement', 'the game will start soon');// 发送给同在 'myNamespace' 命名空间下的所有客户端，包括发送者io.of('myNamespace').emit('bigger-announcement', 'the tournament will start soon');// 发送给指定 socketid 的客户端（私密消息）socket.to(<socketid>).emit('hey', 'I just met you');// 包含回执的消息socket.emit('question', 'do you think so?', function (answer) {});// 不压缩，直接发送socket.compress(false).emit('uncompressed', "that's rough");// 如果客户端还不能接收消息，那么消息可能丢失socket.volatile.emit('maybe', 'do you really need it?');// 发送给当前 node 实例下的所有客户端（在使用多个 node 实例的情况下）io.local.emit('hi', 'my lovely babies');};

服务端

io.on(‘connection’,function(socket));//监听客户端连接,
//回调函数会传递本次连接的socketio.sockets.emit(‘String’,data);//给所有客户端广播消息io.sockets.socket(socketid).emit(‘String’, data);//给指定的客户端发送消息socket.on(‘String’,function(data));//监听客户端发送的信息socket.emit(‘String’, data);//给该socket的客户端发送消息

使用scoket.io来实现简单的及时通讯相关推荐

使用Webtask.io创建一个简单的REST API端点
by ismapro 由ismapro 使用Webtask.io创建一个简单的REST API端点 (Create a simple REST API endpoint using Webtask.i ...
利用socket.io+nodejs打造简单聊天室
代码地址如下: http://www.demodashi.com/demo/11579.html 界面展示: 首先展示demo的结果界面,只是简单消息的发送和接收,包括发送文字和发送图片. ws说明: ...
java用流实现复制功能_【java】IO流实现简单的复制功能
package ioTest; import java.io.File; import java.io.FileInputStream; import java.io.FileOutputStream ...
实验1：用户的登录与退出、IO重定向与简单文件操作
实验1:用户的登录与退出.IO重定向与简单文件操作 1.实验目的 (1).掌握系统开启和关闭的方法及正常关闭系统的意义和必要性: (2).掌握用户的登录与退出的方法及用户退出系统或注销的意义和必要性: ...
使用socket.io做一个简单的WEB聊天室
使用socket.io做一个简单的WEB聊天室(可消息私发) 1. 创建一个空的工程目录空的目录命名为chat-web 2. 创建package.json 使用命令:npm init,会引导你设置p ...
基于Netty最简单的WebSocket通讯
基于Netty最简单的WebSocket通讯基于Netty最简单的WebSocket通讯总览服务端 EasyWsServer EasyWsServerHandler 客户端 EasyWsClie ...
微信公众号开发用书php,php微信公众号开发（3）php实现简单微信文本通讯
<PHP实战:PHP微信公众号开发(3)PHP实现简单微信文本通讯>要点: 本文介绍了PHP实战:PHP微信公众号开发(3)PHP实现简单微信文本通讯,希望对您有用.如果有疑问,可以联系我 ...
一个简单的HTTP通讯的例子，使用了CInternetSession，CHttpConnection，CHttpFile三个类
一个简单的HTTP通讯的例子,使用了CInternetSession,CHttpConnection,CHttpFile三个类. http://blog.csdn.net/STK_tianwen/ar ...
串口RS232 RS485最本质的区别！-！I2C通讯协议最简单的总线通讯！-深入理解SPi通讯协议！
5分钟看懂!串口RS232 RS485最本质的区别!-4分钟看懂!I2C通讯协议最简单的总线通讯!-深入理解SPi通讯协议,5分钟看懂! 一.5分钟看懂!串口RS232 RS485最本质的区别! 二 ...

使用scoket.io来实现简单的及时通讯

用scoket.io实现简单的及时通讯