关于socket.io的使用

原文地址:关于socket.io的使用javascript

这段时间学习了socket.io,用它写了小项目,在此总结下它的基本使用方式和一些要点。 socket.io是基于Node.jsWebSocket协议的实时通讯开源框架,它包括客户端的JavaScript和服务器端的Node.js。java

服务端

这里后端使用的框架是koa2socket.io将自身绑定到koa的进程中去,其中最重要的事件就是 connectiondisconnect。它们是框架自己定义的系统事件,也就意味着它是天然就存在的不须要咱们自定义,固然还有其它系统事件,但不多会用获得。git

const koa = require('koa')
const app = new koa()
const server = require('http').createServer(app.callback())
const io = require('socket.io')(server)

//监听connect事件
io.on('connection', socket => {
  socket.emit('open');//通知客户端已链接
  console.log('connected');
  
  //监听disconnect事件
  socket.on('disconnect', () => {
    console.log('disconnect')
  }
});
server.listen(3001);
复制代码

客户端

web端直接传入url地址便可,其中这里监听的 open 事件是用户自定义的,对应服务端的则是发送open事件。github

import io from 'socket.io-client';

//创建websocket链接
const socket = io('http://127.0.0.1:3001');

//收到server的链接确认
socket.on('open', () => {
    showTip('socket io is open !');
    init();
});
复制代码

emit 和 on

emiton 是最重要的两个api,分别对应 发送监听 事件。web

  • socket.emit(eventName[, ...args]):发射(触发)一个事件
  • socket.on(eventName, callback):监听一个 emit 发射的事件

咱们能够很是自由的在服务端定义并发送一个事件emit,而后在客户端监听 on,反过来也同样。后端

发送的内容格式也很是自由,既能够是基本数据类型 NumberStringBoolean 等,也能够是 ObjectArray 类型,甚至还能够是函数。而用回调函数的方式则能够进行更便携的交互。api

/*** 服务端 **/
socket.on('message',data =>{
  console.log(data)
});

socket.emit('send','hello everybody');

/*** 客户端 **/
socket.emit('message',{id:'1',txt:'hello'});

socket.on('send',data =>{
  console.log(data);
});

//回调函数
/*** 服务端 **/
socket.on('sayit', (word, callback)=> {
  callback('say ' + word);
});

/*** 客户端 **/
socket.emit('sayit', 'wow', data => { 
  console.log(data); // say wow
});
 
复制代码

broadcast 广播

broadcast 默认是向全部的socket链接进行广播,可是不包括发送者自身,若是本身也打算接收消息的话,须要给本身单独发送。服务器

/*** 服务端 **/
io.on('connection', socket => {
 const data= {
   txt:'new user login',
   time:new Date()
 }
 //广播向全部socket链接
 socket.broadcast.emit('userin',data);
 //给本身也发一份
 socket.emit('userin',data);
});
复制代码

namespace 命名空间

若是你想隔离做用域,或者划分业务模块,namespace 是个有效的法子。namespace 至关于创建新的频道,你能够在一个 socket.io 服务上面隔离不一样的链接,事件和中间件。websocket

默认的链接也是有namespace的,那就是 /并发

使用命名空间的方式一:直接在连接后面加子域名,这种其实用的仍是同一个 sokcet 服务进程,能够当作是软隔离吧。

/*** 客户端 **/
import io from 'socket.io-client';

//默认的namespace
const socket = io('http://127.0.0.1:3001');
// mypath
const socket = io('http://127.0.0.1:3001/mypath', { forceNew: true });

/*** 服务端 **/
//默认的namespace
io.on('connection', socket => {
});
// mypath
io.of('/mypath').on('connection', socket => {
});
复制代码

使用命名空间的方式二: path 参数,这种就是实打实的从新起了一个 socket 服务了。

/*** 客户端 **/
const socket = io('http://localhost', {
  path: '/mypath'
});

/*** 服务端 **/
// 另外从新起socket服务
const io = require('socket.io')({
  path: '/mypath'
});
复制代码

middleware 中间件

socket.io 的中间件 和 kao2 的很是类似,这意味着咱们能够在变更很小的状况下,将koa2的中间件改造为 socket.io 所用。

const mypath = io.of('/mypath').on('connection', socket => {
    socket.on('message', data => {
    });
});

//中间件
const auth = (socket, next) => {
  const data = socket.request;
  if(!verify(data)){
    throw new Error('not verify');
  }
  next();
}
// mypath 这个 namespace 注册中间件
mypath.use(auth);
复制代码

rooms

每个socket链接都会有一个独一无二的标志,那就是 socket.id,咱们就是经过id来区分不一样链接的。除此以外,socket.id 自己也是房间 room 的标志,通俗讲,每一个socket 链接自身都拥有一间房 room。那么咱们就能够给这个 room 发送消息,还有若是你加入了房间,就能接受到房间里的广播信息。固然你能够自定义 room ,让socket链接加入或离开。还有若是 socket 断开链接,也就是 disconnect 后,它会被自动移出room。

而这就是实现 单独聊天群组聊天 的基础,来看一下对应的api。

  • socket.join(rooms[, callback]):加入房间
  • socket.leave(room[, callback]) :离开房间
  • socket.to(room): 给房间发送消息
// 自定义room
io.on('connection', socket =>{    
  socket.join('some room')); // 加入房间
  socket.leave('some room'); // 离开房间
}); 

// 向房间里的全部客户端发送消息
io.to('some room').emit('some event'); 

// 默认房间(每个id一个room)
socket.on('say to someone', (id, msg) => {    
    socket.broadcast.to(id).emit('my message', msg); 
}); 
复制代码

总结

相信有了以上介绍的基础知识,再加上官网对应的文档,要开发聊天室或者其余 实时通讯 的项目,是一件易如反掌的事情

socket.io官网 里面有对 api 很是详细的讲解和用例。

相关文章
相关标签/搜索