"HTML5 WebSocket" WebSocket object properties and methods

"HTML5 websocket authoritative Guide" study notes &3

The object attribute of the WebSocket method is 1. WebSocket method A. Send method

The Send method is used to send a message to the server after the WebSocket connection is established.

Can be divided into sending two kinds of messages, one is the ordinary text information, one is binary data.

It should be noted that the Send method must be used after the connection is established. That is, it is used in onopen to make no mistakes.

Send a normal message

This is relatively simple, in the last study of the WebSocket event is used, just need to send (message) can.

Send binary data

In Web applications, we also need to send binary data, such as pictures, audio, and video, which requires a combination of BLOB classes. Blod is a binary large object.

Here is a comprehensive demo sample:

WS = WebSocket ("Ws://echo.websocket.org/echo",[]);/ * Open Event trigger indicates successful protocol handshake, WebSocket and ready to receive and send data */Ws.onopen = function(e){Console.log ("Start ...");//Send text messageWs.send ("Hello World");//Send binary Object        vardata =NewBlob ("Blob Object");    Ws.send (data); }/ * Message messages are triggered when the client receives a message * /Ws.onmessage = function(e){Console.log ("Receive information such as the following:");if(typeofE.data = ="string") {Console.log ("text message:", E,e.data); }Else{Console.log ("Non-text message:", E,e.data);    } ws.close (); }

B. Close Method |

close方法用于关闭连接，它能够不带參数表示直接关闭。也能够带上两个參数(code,reason)向服务端提交关闭连接的原因：    1.  ws.close()    2.  ws.close(1000,"close normally")

2. Object Properties

在学习了WebSocket的方法后，接下来学习一下WebSocket提供的对象特性，这些特性提供了关于WebSocket对象的很多其它信息：readyState、bufferedCount和protocol。英文稍好的话事实上由字面就可知道这三个对象分别相应着WebSocket的什么特性。
以下一一介绍一下：

A. ReadyState

WebSocket reports its connection status by simply reading the feature readystate. The connection state has four together, and the user can infer the connection state at this point and then proceed to the next step. The following is a list of four connection states:

Attribute Constants	Take value	Status
Websocket.connecting	0	The connection is in progress. But it hasn't been established yet.
Websocket.open	1	The connection has been established. Messages can start passing
Websocket.closing	2	The connection is shutting down
Websocket.closed	3	Connection is closed

<br>

Here is a demo sample:

    varnew WebSocket("ws://echo.websocket.org/echo",[]);    if(ws.readyState == WebSocket.CONNECTING){        console.log("连接正在建立");    }    function(e){        if(ws.readyState == WebSocket.OPEN){            console.log("连接已打开！
"); } }

B. Bufferedamount

When the client sends a large amount of data to the server. The browser caches the data in the browser's send queue, and then sends it to the server in a piecemeal manner. The Bufferedamount feature is to tell the client how much data has been cached but not sent in the queue today.

The scale is as follows:

varLimit =10240;varWS =NewWebSocket ("ws://echo.websocket.org",[]);/*open Event trigger indicates successful protocol handshake, WebSocket and ready to receive and send data */Ws.onopen = function(e){Console.log ("Start ..."); SetInterval ( function(){        if(Ws.bufferedamount < limit) {varA = [] for(varI=0;i< +; i++) {A.push (1);        } ws.send (a); }    },Ten); SetInterval ( function(){Console.log (Ws.bufferedamount); }, -)}

C. Protocol

The protocol feature includes the protocol name Websocketserver selected during the open handshake, in other words, the Protocol feature tells you the protocol used on a particular websocket.

"HTML5 WebSocket" WebSocket object properties and methods