WebSockets - 事件和操作

---

为了实现客户端之间的通信，需要初始化客户端到服务器的连接。为了初始化连接，需要使用远程或本地服务器的 URL 创建 Javascript 对象。

var socket = new WebSocket(“ ws://echo.websocket.org ”);

上面提到的URL是一个公共地址，可以用于测试和实验。websocket.org 服务器在收到消息并将其发送回客户端时始终处于运行状态。

这是确保应用程序正常运行的最重要的步骤。

Web Sockets – 事件

有四个主要的 Web Socket API事件-

• 打开
• 信息
• 关闭
• 错误

每个事件都是通过分别实现onopen、onmessage、onclose和onerror 等函数来处理的。也可以借助addEventListener方法来实现。

事件和功能的简要概述如下 -

打开

一旦客户端和服务器之间建立了连接，Web Socket 实例就会触发 open 事件。这被称为客户端和服务器之间的初始握手。连接建立后引发的事件称为onopen。

信息

消息事件通常在服务器发送一些数据时发生。服务器发送到客户端的消息可以包括纯文本消息、二进制数据或图像。每当发送数据时，就会触发onmessage函数。

关闭

Close事件标志着服务器和客户端之间的通信结束。借助onclose事件可以关闭连接。通过onclose事件标记通信结束后，服务器和客户端之间将无法再传输任何消息。由于连接不良也可能导致活动结束。

错误

错误标记是在通信过程中发生的某些错误。它是借助onerror事件进行标记的。Onerror后始终会终止连接。每个事件的详细描述将在后续章节中讨论。

Web 套接字 – 操作

事件通常在某些事情发生时被触发。另一方面，当用户希望发生某些事情时，就会采取行动。操作是通过用户使用函数的显式调用来执行的。

Web Socket 协议支持两个主要操作，即 -

• 发送（ ）
• 关闭（ ）

发送 （ ）

对于与服务器的某些通信，通常首选此操作，其中包括发送消息，其中包括文本文件、二进制数据或图像。

借助 send() 操作发送的聊天消息如下 -

// get text view and button for submitting the message
var textsend = document.getElementById(“text-view”);
var submitMsg = document.getElementById(“tsend-button”);

//Handling the click event
submitMsg.onclick = function ( ) {
   // Send the data
   socket.send( textsend.value);
}

注意- 仅当连接打开时才可以发送消息。

关闭 （ ）

此方法代表告别握手。它会完全终止连接，并且在重新建立连接之前无法传输任何数据。

var textsend = document.getElementById(“text-view”);
var buttonStop = document.getElementById(“stop-button”);

//Handling the click event
buttonStop.onclick = function ( ) {
   // Close the connection if open
   if (socket.readyState === WebSocket.OPEN){
      socket.close( );
   }
}

还可以借助以下代码片段故意关闭连接 -

socket.close(1000,”Deliberate Connection”);