WebSocket学习笔记

HTTP1.1协议实质上就是半双工信道,无法同时发送数据和接收数据,而且HTTP连接必须是客户端发起,由服务器来进行处理响应,只有HTTP2.0才是全双工信道(不需要等待响应,就可以发送第二个报文) WebSocket是全双工信道,而且还支持服务端主动发送数据给客户端,是服务器推送技术(还是需要客户端发起连接) WebSocket协议是应用层协议,而且是建立在TCP协议上,端口也是使用443和80,握手使用HTTP协议,浏览器不会限制WebSocket的同源 WebSocket客户端配置 WebSocket构造函数,用来创建WebSocket实例 const ws = new WebSocket(‘ws://127.0.0.1’) WebSocket.readyState实例具备4种状态,该属性是只读的,用来表示连接WebSocket服务端的状态,分别是:0(正在连接),1(连接完成并且可以通信),2(连接正在关闭),3(连接已经关闭或者连接失败) WebSocket.onopen是指定连接成功后执行的回调函数 WebSocket.onerror是指定连接失败后执行的回调函数 WebSocket.onclose是指定连接关闭后执行的回调函数 WebSocket.onmessage是指定从服务器获取信息时执行的回调函数 可以指定WebSocket.binaryType来指定传输的数据类型,数据类型有2种,分别是blob和arraybuffer 客户端配置例如: const ws = new WebSocket('ws://localhost:8080') ws.onopen = () =>{ console.log("连接中") ws.send('hallo word') // 向服务端发送数据 } ws.onerror = () =>{ console.log('连接失败') } ws.onmessage = (evt) =>{ console.log('连接成功,正在获取数据') if(typeof evt.data === String){ console.log('hallo'+evt.data) }else if(evt.data instanceof ArrayBuffer){ let data = evt.data console.log('数据:'+data) } ws.close() // 手动关闭连接 } ws.onclose = () =>{ console.log('连接已关闭') } 还有WebSocket.bufferedAmount属性,也是只读,用于返回WebSocket..send没有发送到服务端的数据的字节数,为0表示全部数据已传输完毕 WebSocket.url属性可以返回WebSocket实例的URL绝对路径,只读...

2022-11-05 · 2 min · Me