得益于技术，过去数月要跨大洋传输的数据现在可以在几秒钟内获得。 作为这些数据的使用者，人们越来越依赖于立即访问可靠的信息。 WebSockets是前端程序可以连接并接收最新信息的一种方式。
在正常的AJAX请求中，连接或对话必须由浏览器启动。 服务器无法启动此对话。 AJAX请求完成后，连接关闭。 可以通过使浏览器连续向服务器询问数据来模拟实时通信，但这效率低下。
文档指出，WebSockets是“用于连接到WebSocket服务器，然后在该连接上发送和接收数据的主要接口。”简单来说，WebSocket打开从浏览器到服务器的连接，在收到响应后该连接保持打开状态。 服务器或浏览器可以启动双向通信。 这将创建真正的实时Web应用程序。
好消息！ 浏览器内置了WebSocket，创建此连接仅需几行代码。 要访问内置库，请在JavaScript文件中创建一个变量，以标识新的WebSocket连接。
例：
让ws = new WebSocket（’ws：// localhost：3001’）
ws.send（’Message’）将信息发送到后端。
ws.addEventListener（’message’，function（event）{
{事件是一个对象，数据作为其实际上包含消息的属性之一}
}）
就是这样……这是前端开始连接所需的全部代码！ 要在浏览器中调试WebSocket连接，网络面板内部有一个过滤器“ WS”。 HTTP请求中没有框架选项卡，该选项卡显示了来回通信的表。
要创建相应的服务器来处理WebSocket请求，需要花费更多的代码行，但是这样做仍然相对简单。
使用Node.js，通过键入npm install来安装WebSocket模块-在命令行中保存ws。
还有其他可用的工具，例如Socket.io，但是此示例使用普通的WebSockets。
在后端创建WebSocket服务器的示例代码：
const WebSocket = require（’ws’）
const WebSocketServer = WebSocket.Server;
const端口= 3001;
const ws = new WebSocketServer（{
端口：端口
}）;
重要的是要注意，这不会替换正在使用的任何其他服务器； 它仅用于WebSocket连接。 还必须注意，WebSocket应用程序不能与运行HTTP服务器的端口相同。 在此示例中，WebSocket服务器在端口3001上列出，而我使用Node.js构建的服务器在端口3000上进行侦听。创建应用程序时，都需要这两个服务器。
WebSockets是发送短消息的理想选择。 HTTP请求可能仍将更适合大型文件，元数据等。
与WebSocket的连接可以称为“客户端”。 要收听尝试连接的客户端，请使用ws.on：
ws.on（’connection’，function（socket）{
console.log（’建立客户端连接’）;
messages.forEach（function（msg）{
socket.send（msg）;
}）;
socket.on（’message’，function（data）{
console.log（’收到的消息：’+数据）;
ws.client.forEach（function（clientSocket）{
clientSocket.send（data）;
}）;
socket.send（data）;
}）;
函数内部的信息是服务器如何响应客户端消息。 在此示例中，服务器console.log记录新客户端已连接的消息。 套接字是从WebSocket服务器接收回的对象（类似于HTTP请求中接收的数据）。 对于收到的新消息，服务器将这些消息发送到每个连接的客户端。
可以访问套接字的任何客户端或应用程序都可以使用socket.send发送信息。 多个前端可以一次连接到WebSocket，类似于一个主电源盒具有多根电线。 Node.js非常适合处理所有这些连接。 由于范围的原因，套接字函数位于ws.on函数内部。 套接字功能特定于所连接的特定客户端，每个“ ws.on”表示一个不同的连接。
要将消息发送到所有连接，代码如下所示：
ws.sockets.forEach（socket => {
client.send（’嘿’）
}
为了测试这一点，有一个命令行实用程序可让您模拟浏览器连接，类似于对HTTP请求使用Postman。
npm install -g wscat
命令行：wscat -c ws：// localhost：3001
出去那里并建立联系！
