Nodejs 怎么根据不同的url地址创建不同的聊天室?

Nodejs 怎么根据不同的url地址创建不同的聊天室?

用socket.io+express根据不同的url创建不同的聊天室?请指点

6 回复

要使用 Node.js 和 socket.io + express 创建根据不同的 URL 地址创建不同的聊天室，你可以通过路由来区分不同的聊天室，并在每个聊天室中使用 socket.io 来处理实时通信。以下是一个简单的实现示例：

安装依赖

首先确保你已经安装了 express 和 socket.io：

npm install express socket.io

示例代码

接下来，我们来看一个简单的示例代码：

const express = require('express');
const http = require('http');
const socketIo = require('socket.io');

// 初始化 Express 应用
const app = express();
const server = http.createServer(app);
const io = socketIo(server);

// 聊天室存储
let chatRooms = {};

// 设置静态文件目录
app.use(express.static('public'));

// 路由处理
app.get('/', (req, res) => {
    res.sendFile(__dirname + '/index.html');
});

app.get('/chat/:roomId', (req, res) => {
    const roomId = req.params.roomId;
    
    // 如果房间不存在，则创建
    if (!chatRooms[roomId]) {
        chatRooms[roomId] = [];
    }
    
    res.sendFile(__dirname + '/chat.html');
});

// 监听连接事件
io.on('connection', (socket) => {
    console.log('A user connected:', socket.id);

    // 监听加入房间的事件
    socket.on('joinRoom', ({ username, roomId }) => {
        socket.join(roomId);
        chatRooms[roomId].push({ id: socket.id, username });

        // 广播给所有用户
        io.to(roomId).emit('newUserJoined', { username });
    });

    // 监听消息发送事件
    socket.on('sendMessage', ({ message, roomId }) => {
        io.to(roomId).emit('messageReceived', { message, username: chatRooms[roomId].find(user => user.id === socket.id).username });
    });

    // 监听断开连接事件
    socket.on('disconnect', () => {
        console.log('A user disconnected:', socket.id);
        
        // 查找并移除该用户
        for (const roomId in chatRooms) {
            chatRooms[roomId] = chatRooms[roomId].filter(user => user.id !== socket.id);
        }
    });
});

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

HTML 页面

你需要两个 HTML 文件，一个是主页 (index.html)，另一个是聊天页面 (chat.html)。

index.html

<!DOCTYPE html>
<html>
<head>
    <title>Chat Rooms</title>
</head>
<body>
    <h1>Welcome to Chat Rooms</h1>
    <ul id="rooms">
        <!-- 房间列表将在这里动态生成 -->
    </ul>
    <script src="/socket.io/socket.io.js"></script>
    <script>
        const socket = io();

        // 获取所有房间
        fetch('/api/rooms')
            .then(response => response.json())
            .then(data => {
                const roomsList = document.getElementById('rooms');
                data.forEach(room => {
                    const li = document.createElement('li');
                    li.innerHTML = `<a href="/chat/${room}">${room}</a>`;
                    roomsList.appendChild(li);
                });
            });
    </script>
</body>
</html>

chat.html

<!DOCTYPE html>
<html>
<head>
    <title>Chat Room</title>
</head>
<body>
    <div id="messages"></div>
    <input type="text" id="username" placeholder="Username">
    <input type="text" id="message" placeholder="Message">
    <button onclick="sendMessage()">Send</button>

    <script src="/socket.io/socket.io.js"></script>
    <script>
        const socket = io();
        const username = prompt("Enter your username:");
        const roomId = window.location.pathname.split('/')[2];

        // 加入房间
        socket.emit('joinRoom', { username, roomId });

        // 发送消息
        function sendMessage() {
            const message = document.getElementById('message').value;
            socket.emit('sendMessage', { message, roomId });
        }

        // 接收消息
        socket.on('messageReceived', (data) => {
            const messagesDiv = document.getElementById('messages');
            messagesDiv.innerHTML += `<p><strong>${data.username}:</strong> ${data.message}</p>`;
        });
    </script>
</body>
</html>

解释

  1. Express 配置：设置了一个基本的 Express 应用，并配置了路由来处理不同的请求。
  2. Socket.io 配置：监听连接、加入房间、发送消息和断开连接的事件。
  3. HTML 页面：提供了一个简单的界面来显示房间列表和聊天界面。

通过这种方式，你可以根据不同的 URL 创建不同的聊天室，并且每个聊天室都可以独立地进行通信。


求指导

我记得有个 namespace 可以限定不同的url

+1

var room = req.params.room;

然后

res.redirect('/chat/'+room);

URL里带参数似乎就好了.

多谢各位,终于搞出来了

要根据不同的URL地址创建不同的聊天室，可以使用Socket.IO结合Express框架。下面是一个简单的示例，展示如何实现这一功能。

首先确保已经安装了必要的依赖包：

npm install express socket.io

接下来是代码部分：

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);

// 定义一个映射，用于存储每个房间的连接
const chatRooms = {};

io.on('connection', (socket) => {
    console.log('A user connected:', socket.id);

    socket.on('joinRoom', ({ url }) => {
        const roomName = url.replace('/', ''); // 假设URL形如 /chatroom1、/chatroom2

        if (!chatRooms[roomName]) {
            chatRooms[roomName] = [];
        }

        chatRooms[roomName].push(socket.id);
        socket.join(roomName);

        console.log(`User ${socket.id} joined room: ${roomName}`);

        // 广播给所有用户更新房间列表
        io.to(roomName).emit('usersList', chatRooms[roomName]);
    });

    socket.on('message', ({ content, room }) => {
        io.to(room).emit('newMessage', { content, from: socket.id });
    });

    socket.on('disconnect', () => {
        console.log('A user disconnected:', socket.id);

        // 遍历所有房间，删除该用户的ID
        Object.keys(chatRooms).forEach(roomName => {
            const index = chatRooms[roomName].indexOf(socket.id);
            if (index > -1) {
                chatRooms[roomName].splice(index, 1);
            }
        });
    });
});

app.get('/:roomName', (req, res) => {
    res.send(`<h1>Welcome to Chat Room: ${req.params.roomName}</h1>
              <script src="/socket.io/socket.io.js"></script>
              <script>
                const socket = io();
                socket.emit('joinRoom', { url: req.url });
                socket.on('usersList', users => console.log(users));
                socket.on('newMessage', message => console.log(message));
                document.getElementById('sendButton').addEventListener('click', () => {
                  const messageContent = document.getElementById('messageInput').value;
                  socket.emit('message', { content: messageContent, room: req.params.roomName });
                });
              </script>
              <input type="text" id="messageInput">
              <button id="sendButton">Send</button>`);
});

server.listen(3000, () => console.log('Server running on port 3000'));

以上代码中，我们定义了一个chatRooms对象来保存每个房间的用户列表，并且监听了用户的连接、加入房间、发送消息以及断开连接事件。通过监听客户端的joinRoom事件，我们可以让用户加入特定的聊天室。当用户发送消息时，我们将消息广播给该房间的所有成员。

在前端部分，我们通过Socket.IO与服务器建立连接，并发送joinRoom事件以加入指定的聊天室。同时，我们也监听了服务器端返回的消息以及用户列表更新事件。这样就可以实现在不同URL地址下创建不同的聊天室了。

回到顶部