实现webIM技术小结——websocket 实例篇

Socket.io 用于浏览器与 Node.js 之间实现实时通信。

• 官网：socket.io/
• 官网聊天室案例：socket.io/get-started…
• Socket.io 中文介绍：www.cnblogs.com/xiezhengcai…
• Socket.io 简述：blog.csdn.net/yczz/articl…

Socket.io介绍

Socket.io 是一个完全由 JavaScript 实现、基于 Node.js、支持 WebSocket 协议的用于实时通信、跨平台的开源框架，它包括了客户端的 JavaScript 和服务器端的 Node.js。

Socket.io 设计的目标是支持任何的浏览器，任何 Mobile 设备。支持主流的 PC 浏览器 (IE,Safari,Chrome,Firefox,Opera等)，Mobile 浏览器(iphone Safari/ipad Safari/Android WebKit/WebOS WebKit等)。

但是，WebSocket 协议是 HTML5 新推出的协议，浏览器对它的支持并不完善，由此可以看出，Socket.io 不可能仅仅是对 WebSocket 的实现，它还支持其他的通信方式，如上篇博客介绍过的 ajax 轮询和 Long Polling   https://blog.csdn.net/PINGER0077/article/details/90270693。根据浏览器的支持程度，自主选择使用哪种方式进行通讯。

Socket.io 支持的通信方式：

• WebSocket
• Adobe Flash Socket
• AJAX long-polling
• AJAX multipart streaming
• Forever IFrame
• JSONP polling

socket.io的使用

node端使用express框架

引入

服务端：npm install --save socket.io

浏览器端：import io from 'socket.io-client';    const socket = io('ws://localhost:9093')

创建io服务器

let app = require('express')();
let server = require('http').Server(app);
let io = require('socket.io')(server);
app.get('/', function(req, res) {
    res.sendFile(_dirname + '/index.html');
});
server.listen(3000, function() {
    console.log('App listenning on port 3000!');
));

服务端

Socket.io提供了默认事件（如： connect，message， disconnect）。另外，socket.io允许发送并接收自定义事件

监听客户端连接，回调函数会传递本次连接的socket

io.on('connection', function(socket){});

给所有客户端广播消息

io.socket.emit('string', data);
io.emit('string', data);

接收客户端发送的自定义事件

​io.on('connection', function(socket){});