[Html5 WebSocket] WebSocket event and html5websocket event

[Html5 WebSocket] WebSocket event and html5websocket event

Study Notes in HTML5 WebSocket authoritative guide & 2

Previous Article: [Html5 WebSocket] WebSocket Constructor

WebSocket event

WebSocket programming follows the asynchronous programming mode. As long as the WebSocket connection is enabled, the application starts to listen to events. The client does not need to actively poll the server to obtain more information. The following are four different listeners of the WebSocket object:

• Open
• Message
• Error
• Close

The preceding four events are the same as all Web APIs. You can use the on <event name> method to process object properties to listen to these events, or the addEventListener () method.

Open message

An Open event is called after the handshake between the client and the server is successful. In this event, the client can be called to send data to the server and other services for processing. The following is an example:

Var ws = new WebSocket ("ws: // echo.websocket.org/echo", []);/* triggering of an open event indicates that the protocol handshake is successful, WebSocket, and prepare to receive and send data */ws. onopen = function (e) {console. log ("start .. "); ws. send ("Message send"); // send a text Message to the server}

After the preceding page is loaded
The developer tool console outputs start ..

Message

The message is triggered when the client receives the message. The application sends the message content to the listener for processing. Because in the client API learning stage, we use echo.websocket.org as the server, so to trigger the message here, we need to send a message to the server first, and the server will return the original message, the following is an example:

Var ws = new WebSocket ("ws: // echo.websocket.org/echo", []);/* triggering of an open event indicates that the protocol handshake is successful, WebSocket, and prepare to receive and send data */ws. onopen = function (e) {console. log ("start .. "); ws. send ("Message send");}/* The message is triggered when the client receives the Message */ws. onmessage = function (e) {console. log ("message .. "); if (typeof e. data = "string") {console. log ("String message recevied", e, e. data);} else {console. log ("Other message recevied", e, e. data);} ws. close ();}

View the output result on the console.

Error Message

The error message is triggered when an unexpected fault is returned. After the message is triggered, the close message is triggered immediately. Therefore, this message is most suitable for connection restart and other operations. In order to trigger this message (just to learn and see the effect), we must first make an error by sending a protocol (example) that the server cannot understand. In this way, the connection will not be established successfully, an error event is triggered. The following is an example:

Var ws = new WebSocket ("ws: // echo.websocket.org/echo", ["example"]);/* The close message is triggered when the connection is closed */ws. onclose = function (e) {console. log ("close", e );}

Close message

The close message is triggered when the connection is closed. After the connection is established, close the connection using the close method to trigger the close event.

Var ws = new WebSocket ("ws: // echo.websocket.org/echo", []);/* triggering of an open event indicates that the protocol handshake is successful, WebSocket, and prepare to receive and send data */ws. onopen = function (e) {console. log ("start .. "); ws. close ();}/* The close message is triggered when the connection is closed */ws. onclose = function (e) {console. log ("close .. ");}

You can see the output in the console
Start ..
Close ..