在现代 Web 开发中，实时的聊天应用已经成为了一项极为普遍的需求。而 socket.io 和 node.js 组合起来，非常适合用于搭建这样的实时聊天应用。本篇文章将详细介绍如何利用 socket.io 和 node.js 搭建一个实时聊天室。
什么是 socket.io？
socket.io 是一个基于事件驱动的实时通信库。它可以让前端和后端之间实现双向的、基于事件的实时通信。socket.io 支持多种不同的传输方式，包括 WebSocket、AJAX 轮询和 JSONP 轮询等等，以便在不同的环境中都能够使用。
socket.io 最初是为了解决 WebSocket 兼容性问题而创建的。在早期的浏览器中，WebSocket 并不是一个普及的技术。但是 socket.io 通过多种传输方式的支持，可以在不支持 WebSocket 的浏览器中也能够正常工作。而在现代浏览器中，socket.io 会优先使用 WebSocket。
什么是 node.js？
node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。它可以让我们用 JavaScript 来编写后端代码，从而实现前后端的统一。node.js 的优势在于其高效的事件驱动机制和非阻塞 I/O 模型，可以轻松地实现高并发的服务器程序。
搭建一个简单的实时聊天室
为了演示如何使用 socket.io 和 node.js 搭建一个实时聊天室，我们将从头开始创建一个简单的聊天室应用。首先，在你的本地计算机上新建一个空的项目目录，然后在该目录下创建一个名为 server.js 的文件，并输入以下基础代码：
-- -------------------- ---- ------- ----- --- - --------------------- ----- ---- - ---------------------------- ----- -- - --------------------------- ----- ---- - ---------------- -- ----- ------------ ----- ---- -- - ---------------------- - --------------- --- ------------------- -------- -- - -------------- ---- ------------ --- ----------------- -- -- - ---------------------- -- ------------ ---展开代码
以上代码启动了一个基于 express 的 http 服务器，并且将其绑定到了一个端口。然后我们使用 socket.io 侦听客户端和服务器之间的连接，并在控制台输出一个 log，以表明一个用户已连接。
接下来，我们需要编写聊天应用的前端代码。在你的项目根目录下新建一个名为 index.html 的文件，并输入以下代码：
-- -------------------- ---- ------- --------- ----- ------ ------ ---------------- ------------ ------- - - ------- -- -------- -- ----------- ----------- - ---- - ----- ---- ---------- ------ - ---- - ----------- ----- -------- ---- --------- ------ ------- -- ------ ----- - ----- - ------- -- -------- ----- ------ ---- ------------- ---- - ------ - ------ --- ----------------- -------- ---- ----- ------- ----- -------- ----- - --------- - ---------------- ----- ------- -- -------- -- - --------- -- - -------- --- ----- - --------- ----------------- - ----------- ----- - -------- ------- ------ --- ------------------- ----- ------------------ ------ ----------- ------------------ ------------------ ----------------- ---------- --------------------- ------- ------- --------------------------------------- -------- --- ------ - ----- --- ---- - ---------------------------------------- --- ----- - ----------------------------------------- --- -------- - ------------------------------------ ------------------------------- ----------- - ------------------- -- ------------- - ----------------- --------- ------------- ----------- - --- - --- --------------- --------- ------------- - --- ---- - ----------------------------- ---------------- - ---- --------------------------- ------------------ ---------------------------- --- --------- ------- -------展开代码
上述的 HTML 代码定义了聊天室的 UI 界面，并使用 socket.io 向服务器发送和接收消息。其中，submit 事件被监听并在表单被提交时触发。该事件的默认行为将被取消，我们使用 socket.emit() 方法向服务器发送一个 chat message 事件并传输输入框的值。另外，聊天室将向服务器监听 chat message 事件，然后在 ul 列表中添加一个新的消息。
最后，使用以下命令在浏览器中启动你的应用程序：
$ node server.js
然后在浏览器中打开 http://localhost:3000。你就可以在聊天室内发送和接收消息了。
结语
本文通过使用 socket.io 和 node.js 来实现了一个实时的聊天室应用程序。通过代码示例，你也可以创建自己的聊天室应用，并了解 socket.io 和 node.js 是如何协同工作的。虽然此处的应用并不太复杂，但是 socket.io 和 node.js 已经具备实现更加复杂和实用的应用的能力。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67c92d3ce46428fe9e0417e2
