"HTML5 WebSocket" WebSocket Event

"HTML5 websocket authoritative Guide" study notes &2

Previous post: "Html5 WebSocket" WebSocket constructor

WebSocket Events

WebSocket programming follows the asynchronous programming pattern, and the application begins to listen for events as long as the WebSocket connection is open. The client does not need to actively poll the server for more information. Here are four different listeners for the WebSocket object:

• Open
• Message
• Error
• Close

The above four events, like all Web APIs, can be monitored by on< event names > Handling object properties, or by using the AddEventListener () method.

Open message

The trigger of the Open event is called after the handshake between the client and the server is successful, and in this event the client is called to send the data to the service side for business processing. Here's an example:

varnew WebSocket("ws://echo.websocket.org/echo",[]);/*open事件触发表明协议握手成功，WebSocket以及准备好接收和发送数据*/function(e){    console.log("start..");    ws.send("Message send");//给服务端发送一条文本消息}

After the above page loads
The developer Tools console will output start.

Message messages

Message messages are triggered when a message is received by the client, and the application will give the listener incoming message content for processing. Because it is in the Client API learning phase, we use echo.websocket.org as the service side, so to trigger the message, we need to send a message to the server, the server will return the message as is, the following is an example:

varWS =NewWebSocket ("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 ..."); Ws.send ("Message send");}/*message message triggers when the client receives a message * /Ws.onmessage = function(e){Console.log ("message:");if(typeofE.data = ="string") {Console.log ("String message recevied", E,e.data); }Else{Console.log ("other message recevied", E,e.data); } ws.close ();}

In the console you can see the output

Error message

The error message is triggered in response to an unexpected failure, and when the message is triggered, the close message is then triggered, so the message is best used for the connection restart. In order to trigger this message (just to learn to see the effect), we first have to make a mistake, the way to go wrong is to send a service to the server it can not understand the protocol, example, so that the connection will not establish success, error event triggered, the following is an example:

varnew WebSocket("ws://echo.websocket.org/echo",["example"]);/*close消息在关闭连接时触发*/function(e){    console.log("close",e);}

Close Message

The close message fires when the connection is closed, where we use the Close method to close the connection after the connection is established, which can trigger the close event

varnew WebSocket("ws://echo.websocket.org/echo",[]);/*open事件触发表明协议握手成功，WebSocket以及准备好接收和发送数据*/function(e){    console.log("start..");    ws.close();}/*close消息在关闭连接时触发*/function(e){    console.log("close..");}

The console can see the output
Start..
Close:

"HTML5 WebSocket" WebSocket Event