WebSocket

wangfuxu 2019-07-01

1、websocket 是什么?
解决客户端与服务端实时通信而产生的技术。
先通过HTTP/HTTPS协议进行握手后创建一个用于交换数据的TCP连接,然后服务端与客户端通过此TCP连接进行实时通信。
服务器和客户端可以在给定的时间范围内的任意时刻,相互推送信息。
以前我们实现推送技术,用的都是轮询,在特定时间间隔由浏览器自动发出请求,主动拉取服务器消息。需要不断的向服务器发送请求,会占用大量的带宽和服务器资源。

2、使用websocket
在支持WebSocket的浏览器中,在创建socket之后。可以通过onopen,onmessage,onclose、onerror四个事件实现对socket进行响应

只读属性 readyState 表示连接状态,可以是以下值:
    0 - 表示连接尚未建立。
    1 - 表示连接已建立,可以进行通信。
    2 - 表示连接正在进行关闭。
    3 - 表示连接已经关闭或者连接不能打开。
    
// window.WebSocket "WebSocket" in window 检测浏览器是否支持 WebSocket
var ws = new WebSocket(“ws://localhost:8080”);
// 申请一个WebSocket对象,参数是需要连接的服务器端的地址
// 同http协议使用http://开头一样,WebSocket协议的URL使用ws://开头
// 另外安全的WebSocket协议使用wss://开头。

// 指定连接成功后的回调函数
ws.onopen = function() {  
  console.log(“open”);
  ws.send(“hello”);
  // 用于向服务器发送数据
};
// 或者
ws.addEventListener('open', function (event) {
  ws.send('Hello Server!');
});
// 指定收到服务器数据后的回调函数
ws.onmessage = function(evt) {
  console.log(evt.data)
};
// 指定连接关闭后的回调函数
ws.onclose = function(evt) {
  console.log(“WebSocketClosed!”);
};
// 指定报错时的回调函数
ws.onerror = function(evt) {
  console.log(“WebSocketError!”);
};
// 关闭websocket
websocket.close();

相关推荐