安装
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);
});