zoukankan      html  css  js  c++  java
  • socket.io多房间聊天

      前面说了socket.io最基本的建立长连接,现在简单说一下多房间聊天。

      关键点在

      socket.join(roomid)加入一个房间
      socket.leave(roomid);离开一个房间
    都是写在服务器上,具体代码示例如下:
    客户端:
     1 <!DOCTYPE html>
     2 <html lang="zh-CN">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>socket.io</title>
     6     <script type="text/javascript" src="/socket.io/socket.io.js"></script>
     7 </head>
     8 <body>
     9 <h1>socket.io的多房间</h1>
    10 <input type="button" value="加入房间" onclick="join()"><br>
    11 <input type="button" value="离开房间" onclick="leave()"><br>
    12 </body>
    13 </html>
    14 
    15 <script type="text/javascript">
    16 
    17     //和服务器建立长连接
    18     var socket = io.connect('/');
    19 
    20     var name = 'tony';
    21 
    22     //向服务器端发送自定义消息
    23     function join(){
    24         socket.emit('join', name);
    25     }
    26 
    27     function leave(){
    28         socket.emit('leave', name);
    29     }
    30 
    31     //收到有新的人加入房间的信息
    32     socket.on('system', function(data){
    33         alert(data)
    34     });
    35     //收到我离开的信息
    36     socket.on('leavehint', function(data){
    37         alert(data)
    38     });
    39 
    40 
    41     //和服务器建立长连接
    42     //socket.on('connect', function(){});
    43 </script>

    服务器:

     1 //初始化系统库(引包)
     2 var express = require('express');
     3 var app = express();
     4 var server = require('http').createServer(application);
     5 //引入socket.io这个包
     6 var socketio     = require('socket.io')(server);
     7 var path = require("path");
     8 //加载前端文件index.html
     9 
    10 //设置静态路径
    11 app.use(express.static(path.join(__dirname, "views")));
    12 app.get('/joinRoom', function(request, response){
    13     response.sendFile('./views/joinRoom.html');
    14 });
    15 
    16 //监听用户连接事件
    17 socketio.on('connection', function(socket){
    18     //设置房间id(id自己设置,根据具体情况而定)
    19     var roomid = 'room_1';
    20 
    21     //将用户加入房间
    22     socket.on('join', function(data){
    23         //用户加入房间
    24         socket.join(roomid);
    25         //对房间内的用户发送消息
    26         socketio.sockets.in(roomid).emit('system','hello,'+data+'加入了房间');//包括自己
    27         //socket.broadcast.to(roomid).emit('event_name', data);//不包括自己
    28     });
    29 
    30     socket.on('leave', function(data){
    31         //用户离开房间
    32         socket.leave(roomid);
    33         //向此用户发送信息
    34         socket.emit('leavehint','you are leave!')
    35     });
    36 
    37 });
    38 server.listen(9004);
  • 相关阅读:
    项目总结—jQuery EasyUI- DataGrid使用
    浅谈Dynamic 关键字系列之三(上):ExpandoObject, DynamicObject, DynamicMetaObject
    巧用section在cshtml写入layout中写入head信息 ASP.NET MVC
    ASP.NET MVC Web API 学习笔记---第一个Web API程序
    JSON详解
    【js】JSON.stringify 语法实例讲解
    Linux软件安装方法
    链接文件之硬链接和软链接
    Linux操作系统启动界面(字符or图形界面)的设置及切换方法
    Linux操作系统安装与VMTools的安装
  • 原文地址:https://www.cnblogs.com/wvvv/p/5636958.html
Copyright © 2011-2022 走看看