socketIo 搭建长连接(1)

最新推荐文章于 2024-07-05 15:43:42 发布

努力会有明天

最新推荐文章于 2024-07-05 15:43:42 发布

阅读量5.3k

点赞数

分类专栏： nodeJs

本文链接：https://blog.csdn.net/u010683528/article/details/62049492

版权

本文详细介绍了如何使用Socket.IO搭建长连接，包括JS对象处理、Socket.IO事件语法、服务器信息传输、不分组和分组数据传输。重点讨论了Socket.IO的常用数据传输方式，如socket.emit、socket.broadcast.emit和io.sockets.emit，并讲解了如何进行分组管理和用户授权验证。此外，还提及了精准单用户推送的实现思路。

摘要由CSDN通过智能技术生成

聊天服务器开发

环境搭建

首先下载node.js,前往官网下载并安装,在此中需要下载安装express和socket,前者为node开发web的环境,后者为我们开发聊天服务器的js

搭建项目

1.新建文件夹,qqDemo

2.在项目下安装express和socket.io

npm install --save express  
npm install --save socket.io

3.新建一个index.js作为启动js

4.新建index.html作为前端展示

5.启动进入qqDemo文件夹中,使用命令 node index.js启动站点服务

文件阐述

index.js

var app = require('express')();  
var http = require('http').Server(app);  
var io = require('socket.io')(http);  
   
app.get('/', function(req, res){  
    res.send('<h1>Welcome Realtime Server</h1>');  
});  
   
http.listen(3000, function(){  
    console.log('listening on *:3000');  
});  
  
var onlineUsers = new Array();  
var users = {};  
io.sockets.on('connection', function (socket) {  
  io.sockets.emit('connect',{'status':'正确'});  
  console.log("new conns join ..");  
  socket.on('private message', function (from,to,msg) {  
    console.log('I received a private message by ', from, ' say to ',to, msg);  
    if(to in users){  
        users[to].emit('to'+to,{mess:msg});  
    }  
  });  
  socket.on('new user',function(data){  
     //console.log("socket标示为:"+socket.id);  
     if(data in users){  
           
     }else{  
        var nickname = data;  
        users[nickname]= socket;  
        onlineUsers.push(data);  
        console.log('用户'+data+'加入聊天室');  
        console.log('当前的在线用户有 '+onlineUsers);         
     }  
     io.sockets.emit('online users',onlineUsers);   
  });  
  socket.on('disconnect', function () {  
      var logoutUserName ;  
      for(var obj in users){  
          console.log("obj的值是:"+obj);  
            if(users[obj] == socket){  
                console.log(obj+"用户退出聊天室");  
                logoutUserName = obj;  
                delete users[obj];  
            }  
        }  
        for(var i = 0; i<onlineUsers.length; i++){  
            if(onlineUsers[i] == logoutUserName){  
                onlineUsers.splice(i,i);  
            }  
        }  
        console.log("当前在线人员:"+onlineUsers);  
        //更新在线用户  
        io.sockets.emit('online users',onlineUsers);   
        io.sockets.emit('user disconnected');  
  });  
});

index.html

<!DOCTYPE html>  
<html>  
    <head>  
          
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  
  
        <meta name="format-detection" content="telephone=no"/>  
        <meta name="format-detection" content="email=no"/>  
        <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0" name="viewport">  
        <title>多人聊天室</title>  
        <!--[if lt IE 8]><script src="./json3.min.js"></script><![endif]-->  
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>  
        <script src="http://127.0.0.1:3000/socket.io/socket.io.js"></script>  
    </head>  
    <body>  
    <script>  
        $(function(){  
            var onlineUsers;  
            var socket;  
            var userName;  
            $("#login").on("click",function(){  
                socket = io.connect('ws://localhost:3000');  
                socket.on('connect', function (data) {                
                userName = $('#user_name').val();  
                socket.emit('new user',userName);  
                $('#div').show();  
                //接受聊天信息  
                socket.on('to'+userName, function (data) {  
                    alert("来消息了"+data.mess);  
                    console.log("来消息了"+data.mess);  
                    $message_list.append('<li>'+data.from+'说'+data.message+'</li><li>');  
                });  
                //获得当前在线人员  
                socket.on("online users",function(data){  
                   onlineUsers = data;  
                   console.log("刷新在线人数");  
                   $("#select").empty();  
                   for(var j=0; j< onlineUsers.length; j++){  
                       var option = $("<option value='"+onlineUsers[j]+"'>"+onlineUsers[j]+"</option>");  
                       $("#select").append(option);  
                   }  
                     
                });  
              });  
            });   
                  
             $("#send").click(function(e){       
                  var msg  = $('#message').val(),  
                      to = $('#select').val(),  
                 $message_list = $('#message_list');  
                 socket.emit

最低0.47元/天解锁文章

努力会有明天

关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
socketIo 搭建长连接(1)

聊天服务器开发环境搭建首先下载node.js,前往官网下载并安装,在此中需要下载安装express和socket,前者为node开发web的环境,后者为我们开发聊天服务器的js搭建项目1.新建文件夹,qqDemo2.在项目下安装express和socket.ionpm install --save express npm install --sa
复制链接

扫一扫

专栏目录