Categories: WebSockets教程

WebSockets-打开连接

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

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

以下代码用于创建Web套接字连接-

// Create a new WebSocket.
var socket = new WebSocket('ws://echo.websocket.org');

建立连接后,将在您的Web Socket实例上触发open事件。

onopen是指客户端与服务器之间的初始握手,该握手导致了第一笔交易,并且Web应用程序已准备好传输数据。

以下代码段描述了如何打开Web套接字协议的连接-

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”;
}

优良作法是向等待建立Web套接字连接的用户提供适当的反馈。但是,始终请注意,Web套接字连接速度相对较快。

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

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

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

建立客户端HTML5文件。

WebSocket Test

WebSocket Test

运行试试吧!

上面的HTML5和JavaScript文件显示了Web Socket的两个事件的实现,即:

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

这个人很懒,什么都没有留下~

Share
Published by
terry

Recent Posts

自定义指令:聊聊vue中的自定义指令应用法则

今天我们来聊聊vue中的自定义…

4 天 ago

聊聊Vue中@click.stop和@click.prevent

一起来学下聊聊Vue中@cli…

1 周 ago

Nginx 基本操作:启动、停止、重启命令。

我们来学习Nginx基础操作:…

2 周 ago

Vue3:手动清理keep-alive组件缓存的方法

Vue3中手动清理keep-a…

2 周 ago

聊聊React和Vue组件更新的实现及区别

React 和 Vue 都是当…

3 周 ago