Node.Js socket.io

 安装

npm install socket.io

创建服务

var  server =  require('http').createServer();
var  io  =  require('socket.io')(server, {
    cors: {
        origin:  'null', // 请将'http://localhost:3000'替换为你的前端页面所在的域名
    }
});
server.listen(2555, '127.0.0.1');

监听用户连接

io.on('connection', function (socket) {
    socket.emit("conned", '123');
})

 html+js前端使用

var socket = io("ws://localhost:2555");
    socket.on('conned', function (data) {
    alert(data)
})

给服务端发送消息

 socket.emit("关键字","发送的内容");//关键字怎么写后端也要一样

后端获取

socket.on('kay', function (data) {
     console.log(data,"----")
});

一对一聊天 

后端 

// 导入所需的模块
const  express  =  require('express');
const  app  =  express();
const  http  =  require('http').createServer(app);
var  io  =  require('socket.io')(http, {
 cors: {
 origin:  'null', // 请将'http://localhost:3000'替换为你的前端页面所在的域名
  }
});

// 用户列表,用于存储已连接的用户
const  users  = {};
// 处理用户连接
io.on('connection', (socket) => {
 // 处理用户登录
 socket.on('login', (username) => {
 // 将用户添加到用户列表中
 users[username] =  socket.id;
  });
 // 处理发送消息
 socket.on('send_message', (data) => {
 const { sender, recipient, message } =  data;
 // 检查接收者是否在线
 if (users[recipient]) {
 console.log("用户在线"  +  JSON.stringify(users));
 // 发送消息给接收者
 io.to(users[recipient]).emit('receive_message', { sender, message });
    }
  });
});

// 设置路由
app.get('/', (req, res) => {

 res.setHeader('Access-Control-Allow-Origin', 'http://127.0.0.1:3000');
 res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
 res.setHeader('Access-Control-Allow-Headers', '*');

 res.sendFile(__dirname  +  '/index.html');  // 指定正确的前端页面路径
});

// 启动服务器
http.listen(3000, () => {
 console.log('Server is running on port 3000');
});

 前端

const  socket = io('192.168.31.123:3000');

 // 处理用户登录
    document.getElementById('loginForm').addEventListener('submit', (e) => {
      e.preventDefault();
 const  username = document.getElementById('usernameInput').value;

 // 发送登录事件到服务器

      socket.emit('login', username);

 // 隐藏登录表单,显示聊天界面
      document.getElementById('loginForm').style.display = 'none';
      document.getElementById('chatContainer').style.display = 'block';
    });


 // 处理发送消息
    document.getElementById('messageForm').addEventListener('submit', (e) => {
      e.preventDefault();
 const  recipient = document.getElementById('recipientInput').value;
 const  message = document.getElementById('messageInput').value;

 // 发送消息到服务器
      socket.emit('send_message', { sender: 'A', recipient, message });
 // 清空输入框
document.getElementById('recipientInput').value = '';
      document.getElementById('messageInput').value = '';
});
 // 处理接收消息
    socket.on('receive_message', (data) => {
 const  messageContainer = document.getElementById('messageContainer');
 const  messageElement = document.createElement('div');
messageElement.innerText = `${data.sender}: ${data.message}`;
      messageContainer.appendChild(messageElement);
    });

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值