要使用Node.js的Readline和Socket.io实现实时聊天,你需要按照以下步骤操作:
1、安装依赖库
确保你已经安装了Node.js,在项目文件夹中运行以下命令来安装所需的依赖库:
npm init y npm install express socket.io readline
2、创建服务器文件
创建一个名为server.js
的文件,并在其中添加以下代码:
const express = require('express');
const http = require('http');
const socketIO = require('socket.io');
const readline = require('readline');
const app = express();
const server = http.createServer(app);
const io = socketIO(server);
// 创建readline接口
const rl = readline.createInterface({
input: process.stdin,
output: process.stdout
});
// 监听客户端连接
io.on('connection', (socket) => {
console.log('用户已连接');
// 监听客户端发送的消息
socket.on('message', (msg) => {
console.log('收到消息: ' + msg);
io.emit('message', msg);
});
// 监听客户端断开连接
socket.on('disconnect', () => {
console.log('用户已断开连接');
});
});
// 监听readline输入
rl.on('line', (input) => {
io.emit('message', input);
});
// 启动服务器
const port = 3000;
server.listen(port, () => {
console.log(服务器正在监听端口${port}
);
});
3、创建客户端文件
创建一个名为client.html
的文件,并在其中添加以下代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF8"> <meta name="viewport" content="width=devicewidth, initialscale=1.0"> <title>实时聊天</title> <script src="/socket.io/socket.io.js"></script> <script> const socket = io(); const messages = document.getElementById('messages'); const form = document.getElementById('form'); const input = document.getElementById('input'); // 监听服务器发送的消息 socket.on('message', (msg) => { const item = document.createElement('li'); item.textContent = msg; messages.appendChild(item); window.scrollTo(0, document.body.scrollHeight); }); // 提交表单时发送消息 form.addEventListener('submit', (e) => { e.preventDefault(); if (input.value) { socket.emit('message', input.value); input.value = ''; } }); </script> </head> <body> <ul id="messages"></ul> <form id="form" action=""> <input id="input" autocomplete="off" /><button>发送</button> </form> </body> </html>
4、修改服务器代码以提供静态文件
在server.js
文件中,将以下代码添加到app.use()
之前:
app.use(express.static('public'));
5、创建公共文件夹并移动客户端文件
在项目文件夹中创建一个名为public
的文件夹,并将client.html
文件移动到该文件夹中。
6、启动服务器
在命令行中运行以下命令启动服务器:
node server.js
7、访问聊天界面
在浏览器中访问http://localhost:3000
,你将看到实时聊天界面,在多个浏览器窗口中打开该地址,你可以进行实时聊天。
原创文章,作者:未希,如若转载,请注明出处:https://www.kdun.com/ask/483807.html
本网站发布或转载的文章及图片均来自网络,其原创性以及文中表达的观点和判断不代表本网站。如有问题,请联系客服处理。
发表回复