Nodejs socket.io 聊天小程序分享
5 回复
线上演示的也是 github 地址呢。
差评 没有演示
socket.io 官网的例子你也拿出来分享吗?
呵呵。
我们采用 meteorjs ,在做这样的聊天功能时非常的方便,当然 meteor 是把 socket 吸收进去了。希望以后 websocket 能走得长远
以下是一个基于Node.js和Socket.io构建的简易实时聊天小程序示例,包含核心代码片段及简要说明:
服务端代码(server.js)
const express = require('express');
const http = require('http');
const socketIo = require('socket.io');
const app = express();
const server = http.createServer(app);
const io = socketIo(server);
let users = {};
io.on('connection', (socket) => {
console.log('a user connected');
socket.on('new-user', (name) => {
users[socket.id] = name;
socket.broadcast.emit('user-connected', name);
});
socket.on('send-chat-message', (message) => {
io.emit('chat-message', { message: message, name: users[socket.id] });
});
socket.on('disconnect', () => {
const userName = users[socket.id];
delete users[socket.id];
io.emit('user-disconnected', userName);
console.log('user disconnected');
});
});
const PORT = process.env.PORT || 3000;
server.listen(PORT, () => {
console.log(`Server is running on http://localhost:${PORT}`);
});
客户端代码(index.html)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>实时聊天应用</title>
<script src="/socket.io/socket.io.js"></script>
</head>
<body>
<ul id="messages"></ul>
<form id="form" action="">
<input id="input" autocomplete="off" placeholder="输入消息..."/>
<button>发送</button>
</form>
<script>
// 客户端Socket.io连接及消息发送、接收逻辑
// ...(此处省略具体实现,可参考原始回复)
</script>
</body>
</html>
以上代码展示了如何使用Node.js和Socket.io构建一个基本的实时聊天应用,包括用户连接、消息发送和接收、用户断开连接等功能。