WebSocket - 打开连接

简述

一旦客户端和服务器之间建立了连接，就会从 WebSocket 实例中触发 open 事件。它被称为客户端和服务器之间的初始握手。

建立连接后引发的事件称为onopen。创建 WebSocket 连接非常简单。您所要做的就是调用WebSocket 构造函数并传入服务器的 URL。

以下代码用于创建 WebSocket 连接 -
```
// Create a new WebSocket.
var socket = new WebSocket('ws://echo.websocket.org');
```
建立连接后，将在您的 WebSocket 实例上触发 open 事件。

onopen是指客户端和服务器之间的初始握手，这导致了第一次交易，Web 应用程序准备好传输数据。

以下代码片段描述了打开 WebSocket 协议的连接 -
```
socket.onopen = function(event) {
   console.log(“Connection established”);
   // Display user friendly messages for the successful establishment of connection
   var.label = document.getElementById(“status”);
   label.innerHTML = ”Connection established”;
}
```
向等待建立 WebSocket 连接的用户提供适当的反馈是一种很好的做法。但是，总是注意到 WebSocket 连接相对较快。

建立的 WebSocket 连接的演示记录在给定的 URL 中 - https://www.websocket.org/echo.html

连接建立和对用户的响应的快照如下所示 -

建立打开状态允许全双工通信和消息传输，直到连接终止。

例子

构建 client-HTML5 文件。


<!DOCTYPE html>
<html>
   <meta charset = "utf-8" />
   <title>WebSocket Test</title>
   <script language = "javascript" type = "text/javascript">
      var wsUri = "ws://echo.websocket.org/";
      var output;
     
      function init() {
         output = document.getElementById("output");
         testWebSocket();
      }
     
      function testWebSocket() {
         websocket = new WebSocket(wsUri);
               
         websocket.onopen = function(evt) {
            onOpen(evt)
         };
      }
     
      function onOpen(evt) {
         writeToScreen("CONNECTED");
      }
     
      window.addEventListener("load", init, false);
   
   </script>
   <h2>WebSocket Test</h2>
   <div id = "output"></div>
</html>

输出将如下 -

上面的 HTML5 和 JavaScript 文件显示了 WebSocket 的两个事件的实现，即 -

onLoad有助于创建 JavaScript 对象和初始化连接。
onOpen与服务器建立连接并发送状态。

WebSocket - 打开连接

简述

例子