WebSockets

WebSocket 是为了在一个单独的持久连接上提供全双工的双向通信。有关WebSocket API的内容可以参考这里

这里简单说明下WebSocket在javascript中的用法。

1 WebSocket连接简述

在JavaScript中创建了WebSocket 后,会有一个HTTP请求发送到浏览器发起连接。在取得服务器响应后,建立的连接会从HTTP协议交换为WebSocket协议。所以需要后台web服务器也支持WebSocket才能正常通信。

2 WebSocket API

2.1 实例化WebSocket

创建WebSocket,要先实例化一个WebSocket对象,如下:

var socket = new WebSocket('ws://game.example.com:12010/updates');

实例化的时候需要传入要连接的URL以及其他参数。注意到这里URL连接使用的是自定义的协议'ws://'而并非'http://'。如果是加密连接的话,则使用'wss://'。传入的URL也需要是绝对URL。

使用自定义协议的好处

使用自定义协议(ws,wss)而非HTTP协议的好处是,能够在客户端和服务器之间发送非常少量的数据。由于传递的数据包很小,因此WebSocket很适合移动应用。

2.2 WebSocket的readyState属性.

用来表示连接的状态.

CONNECTING (numeric value 0) //正在连接
    The connection has not yet been established.
OPEN (numeric value 1) //已经连接
    The WebSocket connection is established and communication is possible.
CLOSING (numeric value 2)  //正在关闭
    The connection is going through the closing handshake, or the close() method has been invoked.
CLOSED (numeric value 3)  //已关闭
    The connection has been closed or could not be opened.

2.3 发送和接收数据

WebSocket打开之后,就可以通过连接发送和接收数据.使用send()方法向服务器发送数据.

var socket = new WebSocket('ws://game.example.com:12010/updates');
socket.send("this is a demo");

对于有复杂的数据结构的消息(比如dict),发送之前要进行JSON的序列化。

var message = {
   time: new Date(),
   text: "Hello world!",
   clientID: "xxxxx"      
};
socket.send(JSON.stringify(message));

当服务器向客户端发来消息时,WebSocket对象会触发message事件。返回的数据保存在event.data中。

socket.onmessage = function(event){
     var data = event.data;
     //...  
}


WebSocket的其他事件。

open: 在成功建立连接时触发。

error: 在发生错误时触发,连接不能持续。

close: 在连接关闭时触发。

2.4 关闭WebSocket连接

使用close()方法可以关闭WebSocket连接。

socket.close()

调用之后readyState指变为2,连接关闭后变为3.

原文地址:https://www.cnblogs.com/cedrelaliu/p/5956735.html