WebSocket 对象简介
WebSockets 是一种先进的技术。它可以在用户的浏览器和服务器之间打开交互式通信会话。使用此API,您可以向服务器发送消息并接收事件驱动的响应,而无需通过轮询服务器的方式以获得响应。
何为 WebSocket 对象?
WebSocket 对象是 WebSockets 的接口之一,用于连接WebSocket服务器的主要接口,之后可以在这个连接上发送 和接受数据。
WebSocket
对象提供了用于创建和管理 WebSocket 连接,以及可以通过该连接发送和接收数据的 API。
使用WebSocket()
构造函数来构造一个WebSocket
:
let aWebSocket = new WebSocket(url [, protocols]);
参数解析:
- url: 要连接的URL;这应该是WebSocket服务器将响应的URL。
- protocols(可选): 一个协议字符串或者一个包含协议字符串的数组。这些字符串用于指定子协议,这样单个服务器可以实现多个WebSocket子协议(例如,您可能希望一台服务器能够根据指定的协议(protocol)处理不同类型的交互)。如果不指定协议字符串,则假定为空字符串。
WebSocket 对象的常量
Constant | Value |
---|---|
WebSocket.CONNECTING
|
0
|
WebSocket.OPEN
|
1
|
WebSocket.CLOSING
|
2
|
WebSocket.CLOSED
|
3
|
WebSocket 对象的属性
WebSocket.binaryType
返回 WebSocket 连接所传输二进制数据的类型。
语法:
const binaryType = aWebSocket.binaryType;
返回值:DOMString (一个UTF-16字符串)
"blob"
: 如果传输的是Blob
类型的数据。"arraybuffer"
: 如果传输的是ArrayBuffer
类型的数据。
WebSocket.bufferedAmount
(只读)
用于返回已经被send()
方法放入队列中但还没有被发送到网络中的数据的字节数。
一旦队列中的所有数据被发送至网络,则该属性值将被重置为0。
但是,若在发送过程中连接被关闭,则属性值不会重置为0。如果你不断地调用send()
,则该属性值会持续增长。
语法:
const bufferedAmount = aWebSocket.bufferedAmount;
返回值:整数。
WebSocket.extensions
(只读)
返回服务器已选择的扩展值。目前,链接可以协定的扩展值只有空字符串或者一个扩展列表。
const extensions = aWebSocket.extensions;
返回值:DOMString
。
WebSocket.onclose
返回一个事件监听器,这个事件监听器将在 WebSocket 连接的 readyState
变为 CLOSED
时被调用,它接收一个名字为“close”的 CloseEvent
事件。
语法:
WebSocket.onclose = function(event) {console.log("WebSocket is closed now.");
};
返回值:EventListener
。
WebSocket.onerror
该属性中,你可以定义一个发生错误时执行的回调函数,此事件的事件名为"error"
语法:
WebSocket.onerror = function(event) {console.error("WebSocket error observed:", event);
};
返回值: EventListener
。
WebSocket.onmessage
该属性是一个当收到来自服务器的消息时被调用的 event handler。它由一个MessageEvent调用。
语法
aWebSocket.onmessage = function(event) {console.debug("WebSocket message received:", event);
};
返回值: EventListener
。
WebSocket.onopen
该属性定义一个事件处理程序,当WebSocket
的连接状态readyState
变为1
时调用;这意味着当前连接已经准备好发送和接受数据。这个事件处理程序通过 事件
(建立连接时)触发。
语法:
aWebSocket.onopen = function(event) {console.log("WebSocket is open now.");
};
返回值: EventListener
。
WebSocket.protocol
(只读)
用于返回服务器端选中的子协议的名字;这是一个在创建 WebSocket
对象时,在参数protocols
中指定的字符串,当没有已建立的链接时为空串。
语法:
var protocol = aWebSocket.protocol;
返回值:DOMString
。
WebSocket.readyState
(只读)
返回当前 WebSocket
的链接状态,只读。
语法:
var readyState = WebSocket.readyState;
值:
- 0 (
WebSocket.CONNECTING
) 正在链接中 - 1 (
WebSocket.OPEN
) 已经链接并且可以通讯 - 2 (
WebSocket.CLOSING
) 连接正在关闭 - 3 (
WebSocket.CLOSED
) 连接已关闭或者没有链接成功
WebSocket.url
(只读)
返回值为当构造函数创建 WebSocket
实例对象时URL的绝对路径。
语法:
var url = aWebSocket.url;
返回值:DOMString
。
WebSocket 对象的方法
WebSocket.close()
方法关闭 WebSocket
连接或连接尝试(如果有的话)。 如果连接已经关闭,则此方法不执行任何操作。
语法:
WebSocket.close();
参数:
code
(可选)一个数字状态码,它解释了连接关闭的原因。如果没有传这个参数,默认使用1005。reason
(可选)一个人类可读的字符串,它解释了连接关闭的原因。这个UTF-8编码的字符串不能超过123个字节。
WebSocket.send()
方法将需要通过 WebSocket 链接传输至服务器的数据排入队列,并根据所需要传输的data bytes的大小来增加 bufferedAmount
的值 。若数据无法传输(例如数据需要缓存而缓冲区已满)时,套接字会自行关闭。
语法:
WebSocket.send("Hello server!");
参数:
data
用于传输至服务器的数据。它必须是以下类型之一:
USVString
文本字符串。字符串将以 UTF-8 格式添加到缓冲区,并且bufferedAmount
将加上该字符串以 UTF-8 格式编码时的字节数的值ArrayBuffer
您可以使用一有类型的数组对象发送底层二进制数据;其二进制数据内存将被缓存于缓冲区,bufferedAmount
将加上所需字节数的值。Blob
Blob 类型将队列 blob 中的原始数据以二进制中传输。bufferedAmount
将加上原始数据的字节数的值。ArrayBufferView
您可以以二进制帧的形式发送任何 JavaScript 类数组对象 ;其二进制数据内容将被队列于缓冲区中。值bufferedAmount
将加上必要字节数的值。
WebSocket 对象的事件
WebSocket 对象使用 addEventListener()
或将一个事件监听器赋值给本接口的 on*eventname*
属性,来监听下面的事件。
close event
当与 WebSocket 的连接关闭时,会触发 close 事件。
您可能想知道连接何时关闭,以便您可以更新 UI,或者保存与已关闭连接有关的数据。例子:
exampleSocket.addEventListener('close', (event) => {console.log('The connection has been closed successfully.');
});
error event
当websocket
的连接由于一些错误事件的发生 (例如无法发送一些数据)而被关闭时,一个error
事件将被引发。例子:
// Create WebSocket connection
// 创建一个 WebSocket 连接
const socket = new WebSocket('ws://localhost:8080');// Listen for possible errors
// 监听可能发生的错误
socket.addEventListener('error', function (event) {console.log('WebSocket error: ', event);
});
message event
message
事件会在 WebSocket
接收到新消息时被触发。例子:
// 创建一个 WebSocket 连接
const socket = new WebSocket('ws://localhost:8080');// 监听消息
socket.addEventListener('message', function (event) {console.log('Message from server ', event.data);
});
open event
当一个 WebSocket
连接成功时触发。也可以通过 onopen
属性来设置。例子:
// Create WebSocket connection.
const socket = new WebSocket('ws://localhost:8080');// Connection opened
socket.addEventListener('open', (event) => {socket.send('Hello Server!');
});
学习有趣的知识,结识有趣的朋友,塑造有趣的灵魂!
大家好!我是〖编程三昧〗的作者 隐逸王,我的公众号是『编程三昧』,欢迎关注,希望大家多多指教!
WebSocket 对象简介相关推荐
- WebSocket API简介
WebSocket是html5新增加的一种通信协议,目前流行的浏览器都支持这个协议,例如Chrome,Safari,Firefox,Opera,IE等等,对该协议支持最早的应该是chrome,从chr ...
- 大对象简介+大对象的4种类型+lob类型的优点+lob的组成
大对象简介 1用来存储大型数据,如图片,视频,音乐等 2可用于存储二进制数据,字符数据,引用外部文件的指针的数据类型 大对象的4种类型 1BLOB数据类型 1)它是用来存储二进制数据. 2)可以存储的 ...
- Javascript Proxy对象 简介
Javascript Proxy对象 简介 本文转载自:众成翻译 译者:eJayYoung 链接:http://www.zcfy.cc/article/4755 原文:https://blog.cam ...
- 前端:JS/28/CSS DOM动态样式(style对象,style 对象属性与CSS属性的转换),Event DOM,事件对象简介(DOM和IE中的Event对象),实例:点出满天小星星
CSS DOM动态样式 使用JS操作CSS中的各个属性: JS只能操作或修改行内样式,如:imgObjstyle.border = "1px solid red"; 对于类样式,通 ...
- es6 Reflect对象简介
Reflect对象简介 Reflect对象与Proxy对象一样,也是 ES6 为了操作对象而提供的新 API.Reflect对象的设计目的有这样几个. (1) 将Object对象的一些明显属于语言内部 ...
- ADO.NET Command对象简介
Command 对象简介 Command 对象最主要的工作是透过Connection 对象对数据源下达操作数据库的命令. 我们以下列语法产生Command 对象: Dim cmA As Command ...
- ADO.NET中5大对象简介
ADO.NET中5大对象简介 ADO.NET在以前的学习中接触过,并以应用过,但并没有好好的总结过.最近这段时间的学习又复习了这块的知识,下面就我现在所知道的总结归纳一下. ADO.NET是基于XML ...
- [转载]服务数据对象简介
服务数据对象简介 如果您认为 J2EE 编程模型和 API 迫使开发人员在特定于技术的配置.编程和调试上浪费了太多的时间,那么欢迎您阅读本文.很多 Java™ 开发人员都怀疑如何能以统一的方式访问异构 ...
- JSP page对象简介说明
转自: JSP page对象简介说明 下文笔者将讲述JSP中page对象的简介说明,如下所示: page对象简介page对象是java.long.Object类的实例page对象指JSP页面自身,那么 ...
最新文章
- l2_norm opencv torch比较
- android 按键kl文件,Android添加新按键
- Unity3D 游戏引擎之脚本实现模型的平移与旋转(六)
- Java数据校验(Bean Validation / JSR303)
- JS中的数据类型转换
- jQuery向动态生成的内容添加事件响应(jquery live方法简介)
- 【GCC】Bug 36793 - x86-64 does not get __sync_synchronize right
- Ubuntu 20.04安装python3.6版本后terminal终端无法打开
- Quartz 触发器(SimpleTriggerCronTrigger )配置说明 cronExpression表达式 转
- Atitit.js javascript异常处理机制与java异常的转换 多重catc hDWR 环境 .js exception process Vob7
- iOS 开发全能工具箱
- 二元一次方程组计算机题,2元一次方程组(二元一次方程组计算题带答案)
- P2123 皇后游戏
- 查看用友NC的版本方法(不启动NC,只看NCHOME)
- 浅谈游戏《Cuphead茶杯头》
- 计算机省二打字,巧用音频转文字,省去打字烦恼
- 什么是原型、原型链、组合继承?
- java 不可变_java - String是不可变的。 究竟是什么意思?
- 周期信号的傅里叶级数展开
- Celery-4.1 用户指南: Optimizing
热门文章
- dubbo调用服务出现如下异常
- 机械+固态双硬盘时机械硬盘卡顿问题解决
- React中的state和props有什么区别?
- 检查Python列表项是否在另一个字符串中包含一个字符串
- 浅谈win10修复系统文件的方法
- Android动画学习笔记
- BIO,Socket网络编程入门代码示例,NIO网络编程入门代码示例,AIO 网络编程
- spring cloud微服务之间调用Feign
- Android:学习路线总结,绝对干货
- master节点重置后添加node报错_企业实战(23)基于Docker平台的Jenkins添加node节点与报错详解(2)...