如何在 Node.js 中使用 Demo-Chat App 配置 Socket.IO？
为了制作聊天应用程序，服务器需要向客户端发送数据，但客户端也应该响应服务器。这可以通过使用 Websockets 来完成。 WebSocket是一种在两个方向上打开的通信管道。
先决条件：
- Node.js：它是一种由服务器执行的开源 JavaScript 后端技术。它有自己的包管理器npm （节点包管理器），可以轻松安装包。
- Express.js：它是一个基于 Node.js 的框架。
- Socket.io：它支持基于事件的实时双向通信。它适用于所有平台、浏览器或设备，同样注重可靠性和速度。 Socket.IO 建立在 WebSockets API（客户端）和 Node.js 之上。它是最依赖 npm 的库之一。
设置环境：第一步是启动 npm。因此，创建一个新的存储库并使用以下命令初始化 npm：
$ mkdir chatApp
$ cd chatApp
$ npm init
现在，下一步是安装构建聊天应用程序所需的 npm 包。
- express： Node.js 的 Web 应用程序框架。
- nodemon：（可选）它用于重新启动我们的服务器。如果您不想安装它，只需在终端中编写node app.js即可重新启动服务器。
- ejs：一种简单的模板语言，可让您使用纯 JavaScript 生成 HTML 标记。
- socket.io：管理 Websocket 的包。
只需在终端中运行以下命令即可安装上述软件包：
$ npm install --save express
$ npm install --save socket.io
$ npm install --save ejs
$ npm install --save nodemon
代码实现步骤：
第 1 步：创建 app.js
const express = require('express');
const app = express();
app.set("view engine", "ejs");
app.use(express.static("public"));
app.get("/", function(req, res) {
res.send("Welcome to chat app!");
});
server = app.listen(3000);
如果您在浏览器中运行http://localhost:3000 ，您会看到屏幕上出现如下所示的消息： 
现在要配置 socket.io，我们必须首先在app.js文件中创建一个对象，如下所示：
const io = require("socket.io")(server);
io.on('connection', (socket) {
console.log("New user connected");
});
在这里，io 对象将使我们能够访问socket.io库。 io 对象现在正在侦听与我们应用程序的每个连接。每次有新用户连接时，它都会打印以下输出：
New user connected现在为构建聊天应用程序的窗口，我们将在 views 文件夹中创建一个名为index.ejs的 html 文件（实际上是 ejs 文件）。另一方面， public 文件夹将包含 css 文件，即style.css和 js 文件chat.js 。它看起来像这样：
我们现在将创建一个路由来渲染我们的index.ejs文件，该文件打开我们的聊天应用程序的窗口。
app.get("/", function(req, res) {
res.render("index.ejs");
});
现在，如果您运行http://localhost:3000 ，我们的聊天窗口将如下所示： 
现在我们将在每个尝试连接到我们服务器的客户端上安装socket.io 。为此，我们必须在客户端导入socket.io库：
在你的身体末尾添加这些行：
现在在 public 文件夹中创建一个名为chat.js的 js 文件。
$ (function() {
var socket = io.connect('http://localhost:3000');
});
第 2 步：发送和接收数据现在，我们将编写一些代码，使我们能够发送数据以及从服务器接收数据。
更改用户名：首先，我们将设置一个默认用户名，比如“Xyz”。为此，请在app.js和chat.js文件中记下以下代码。
文件名：app.js
const io = require("socket.io")(server);
io.on('connection', (socket) {
console.log("New user connected");
socket.username="xyz";
socket.on('change_username', (data) {
socket.username = data.username;
});
});
文件名：chat.js
$ (function() {
var socket = io.connect('http://localhost:3000');
var message = $("#message");
var username = $("#username");
var send_message = $("#send_message");
var send_username = $("#send_username");
var chatroom = $("#chatroom");
send_username.click(function() {
console.log(username.val());
socket.emit('change_username',
{ username : username.val() });
});
});
socket.emit() 允许您在服务器和客户端上发出自定义事件。
消息：对于消息，我们修改我们的文件，如下所示：
文件名：chat.js
$ (function() {
var socket = io.connect('http://localhost:3000');
var message = $("#message");
var username = $("#username");
var send_message = $("#send_message");
var send_username = $("#send_username");
var chatroom = $("#chatroom");
send_message.click(function() {
socket.emit('new_message', { message : message.val() });
});
socket.on("new_message", (data) {
console.log(data);
chatroom.append(""
+ data.username+";" + data.message+"
")
});
send_username.click(function() {
console.log(username.val())
socket.emit('change_username',
{username : username.val()})
});
});
文件名：app.js
const io = require("socket.io")(server);
io.on('connection', (socket) {
console.log("New user connected");
socket.username="xyz";
socket.on('change_username', (data) {
socket.username = data.username;
});
socket.on('new_message', (data) {
io.socket.emit('new_message', {
message : data.message,
username : socket.username
});
});
});
我们简单的聊天应用程序的最终结果将如下所示： 
一点进步：我们可以做的更多是在打字时添加一个 jQuery 事件侦听器并发送一个名为打字的套接字事件。
如果有人正在输入消息，它将仅显示。在chat.js和app.js中编写如下代码，如下图：
文件名：chat.js
message.bind("keypress", () {
socket.emit('typing');
});
socket.on('typing', (data) {
feedback.html("" + data.username
+ " is typing a message..." + "
");
});
文件名：app.js
socket.on('typing', (data) {
socket.broadcast.emit('typing', {username : socket.username});
});