首先把socket.io和koa2結(jié)合在同一個項目中
還是比較簡單的
服務端
import Koa from 'koa';
import http from 'http';
import socket from 'socket.io';
const app = new Koa();
//koa中間件 原代碼不動
//app.use(...);
//如果原來是用app.listen(3000);來啟動服務奥裸，現(xiàn)在要改成用http來啟動server
const server = http.createServer(app.callback());
//掛載socket
const io = socket(server);
//監(jiān)聽socket連接
io.on('connection', client => {
})
server.listen(3000);
前端連接socket
import socket from 'socket.io-client';
const io = socket('ws://xxx.xxx.xxx.xxx:3000');
io.on('connect', () => {
})
http相關(guān)請求可以通過原來如axios等方式請求到koa中間件處理與socket.io互不干涉
socket.io服務端常用監(jiān)聽操作
//監(jiān)聽客戶端連接 每個client對應一個開著的瀏覽器窗口
io.on('connection', client => {
//捕獲客戶端send信息
//前端io.send(message)
client.on('message', async function (message) {
})
//捕獲客戶端自定義信息
//前端io.emit('xxx', message);
client.on('xxx', async function (message) {
})
//監(jiān)聽客戶端斷開連接
client.on('disconnect', async function () {
}）
})
socket.io服務端分組
//加入分組
client.join(group_id);
//踢出分組
client.leave(group_id);
//列出所有分組
io.sockets.adapter.rooms
socket.io服務端發(fā)送消息
// 'message' 可自定義 會被前端對應的監(jiān)聽接口捕獲
//指定消息
//給當前連接發(fā)送消息
client.emit('message', message);
//給當前連接發(fā)送'message'消息
client.send(message);
//指定id消息
io.sockets.socket(clientId).emit('message', message);
//廣播消息
//給除了自己以外的客戶端廣播消息
client.broadcast.emit('message', message);
//給所有客戶端廣播消息
io.sockets.emit('message', message);
//對分組中的用戶發(fā)送信息
//不包括自己
client.broadcast.to(group_id).emit('message', message);
//包括自己
io.sockets.in(group_id).emit('message', message);
關(guān)于前端一個用戶多個客戶端登陸的消息推送方法险掀，我現(xiàn)在采用的是分組方式，客戶端連接后獲取當前登陸人user_id湾宙，具體實現(xiàn)方式比較復雜也沒有通用性就不貼了樟氢，總結(jié)起來就是一句話，連接成功后前端發(fā)送一條攜帶jwt的身份認證消息侠鳄，后端認證后獲得user_id埠啃。
然后通過user_id創(chuàng)建分組client.join(user_id);，這樣對一個用戶發(fā)送消息通過io.sockets.in(user_id).emit('message', message);就能下達了伟恶，不用管客戶是否多端登錄
