socket.io

客户端使用

引入socket.io客户端的js

 <script src="./js/socket.io-client/dist/socket.io.js"></script>
        <script type="text/javascript">
          var newssocket=io.connect("http://localhost:3000/newslist") //连接服务器下的某个命名空间
          //向服务器发送news事件
          newssocket.emit("news","name",function(data){ //发送数据时,需要回调函数(当异步获取数据事)
            console.log(data)
            newssocket.emit("newlist",{my:"data"}) //向服务器发送数据
          })
          
          //监听服务器端hi事件
          newssocket.on("hi",function(data){
           console.log(data)
          })
          
        </script>

服务器使用

var app = require('express')();
var News=require("../routes/news")
var http = require('http');
var socketIo=require("socket.io");
app.set("port",3000)
var server=http.createServer(app)
var io=socketIo.listen(server); //监听服务器端口
io.of("/newslist").on("connection",function(socket){ //
    new News(socket,io)
    socket.on("disconnect",function(){
     io.emit("user disconneted")
   })
 })
class News{
    constructor(socket,io){
      this.socket=socket;
      this.io=io;
      this.onmonitorNewList();
      this.onRecieveClient();
    }
    
    /**
     * 监听客户端信息
     */
    onRecieveClient(){
        var that=this;
       this.socket.on("newlist",function(data){
         console.log(data)
       })
       this.socket.on("news",function(name,fn){ //
        console.log(name) 
        that.getNewList(fn)
      }) 
    }
   
    /**
     * 
     * @param {客户端回调函数} fn 
     */
    getNewList(fn){
        var data={
            name:"张三",
            value:""
        }
        fn(data)
     }
}
module.exports=News

socket.io使用方式总结

一 on 和emit事件

on 监听事件
emit 发送事件
var io=require("socket.io").listen(80)
io.on("connnetion",function(socket){
 socket.on("news",function(data){ //监听服务器端的news事件
   console.log(data)
   socket.emit("hello","张三") //向服务器发送hello事件 值为张三
 }) 
})
var io=require("socket.io").listen(80)
io.on("connnetion",function(socket){
  socket.on("hello",function(data){  //监听客户端发送的hello事件
    console.log(data) //data值为张三
    socket.emit("news","newlist")
 })
})

二 发送和获取数据(回调函数)

监听事件(发送数据)--服务器端

var io=require("socket.io").listen(80)
io.on("connnetion",function(socket){
  socket.on("news",function(name,fn){  //第一个为参数 第二个位获取数据后的回调函数
    fn("newlist")
 })
})

发送函数事件(获取数据)---客户端

 socket.emit("news","params",function(data){
 console.log(data) //data的值为newlist
})

三 限制命名空间

如果您可以控制为特定应用程序发出的所有消息和事件,则使用默认/命名空间。 如果您想利用第三方代码或生成与其他人共享的代码,socket.io提供了一种命名空间套接字的方法。

这具有多路复用单个连接的优点。 而不是使用两个WebSocket连接的socket.io,它将使用一个。
客户端

<script>
  var chat = io.connect('http://localhost/chat')
    , news = io.connect('http://localhost/news');
  
  chat.on('connect', function () {
    chat.emit('hi!');
  });
  
  news.on('news', function () {
    news.emit('woot');
  });
</script>

服务器端

var io = require('socket.io')(80);
var chat = io
  .of('/chat')
  .on('connection', function (socket) {
    socket.emit('a message', {
        that: 'only'
      , '/chat': 'will get'
    });
    chat.emit('a message', {
        everyone: 'in'
      , '/chat': 'will get'
    });
  });

var news = io
  .of('/news')
  .on('connection', function (socket) {
    socket.emit('item', { news: 'item' });
  });

四: 发送广播

要进行广播,只需添加广播标志即可发出和发送方法调用。 广播意味着向除了启动它的套接字之外的所有人发送消息。

var io = require('socket.io')(80);

io.on('connection', function (socket) {
  socket.broadcast.emit('user connected');
});

五Socket.io 的发送对象范围

1 向当前客户端发送事件

socket.emit('login', {      numUsers: numUsers    });

2 广播(不包含当前客户端)

socket.broadcast.emit('new message', {  username: socket.username,  message: data});

3 广播(且包含当前客户端)

io.sockets.emit('message', "this is a test");

4 在房间广播(不包含当前客户端)

socket.broadcast.to('game').emit('message', 'nice game');

5 在房间广播(包含当前客户端)

io.sockets.in('game').emit('message', 'cool game');

6 发送给指定客户端

io.sockets.sockets[socketid].emit('message', 'for your eyes only');
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,716评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,558评论 1 294
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,431评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,127评论 0 209
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,511评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,692评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,915评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,664评论 0 202
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,412评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,616评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,105评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,424评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,098评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,096评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,869评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,748评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,641评论 2 271

推荐阅读更多精彩内容

  • 经历了比武的风波,生活又归于平静,每天都重复着昨天的故事,于是有了过了星期三,翻过一座山,过了星期五还有一上午...
    晓晓石头阅读 384评论 0 1
  • 准备有序的地醒来 1.提前一晚做准备。 睡前选好明天穿的衣服,包括配饰和内搭。把它们放在固定的地方,这样的话早晨醒...
    ioodu阅读 484评论 0 1
  • plus彭于晏阅读 121评论 0 0
  • 睡梦中被嘈杂的说话声惊醒,一看手机,才四点钟。怎么回事啊? 先生也醒来,说反正醒了,不如去天安门广场看...
    汾湖秀阅读 841评论 10 9