WebSocket agreement and case "turn"

Source: Internet
Author: User

WebSocket is a mechanism for efficient two-way communication between the server and the client. Can solve the data real-time requirements of high-quality applications, such as: online chat, online education, stocks or positioning.

A: WebSocket produce background:

To address this real-time problem, there are several alternatives:

1. Polling

Concept: The client sends a request to the server through a certain interval of time to keep the data synchronization between client and server;

Cons: When a client sends a request to the server at a fixed frequency, the server-side data may not be updated, resulting in a lot of unnecessary requests, wasted bandwidth, inefficient

2. Comet technology (long polling)

Concept: Long polling after the client sends the request, the server retains the response and maintains the connection, and can return the response from the server at any point in time. The client then establishes a connection to the server again while it receives the response. Example: WEBQQ

Cons: Long polling avoids unnecessary communication processes compared to polling, but also needs to be connected again when updates are available

3. Comet Technology (Stream technology)

Concept: Make a connection by making the first request from the client, and return the response from the server to the client while maintaining the connection

Cons: Server maintenance A long connection increases overhead

The communication data flow of traditional real-time technology is as follows:

Second: The operating mechanism of WebSocket

1, WebSocket only when the handshake connection is used to borrow the HTTP protocol header, the communication part after the successful connection is TCP-based connection, and its only relationship with HTTP is that its handshake request can be as an upgrade request (Upgrade requests) via HTTP Server explanation

2. WebSocket Request Response Client Server interaction diagram

Two-way communication can be done with only one handshake.

3. Advantages of WebSocket Protocol:

1. Header
The header to communicate with each other is very small-about 2 Bytes

2. Server Push
Server push, the server no longer passively receives the browser request to return the data, but the new data when the active push to the browser

API for 4.websocket

There are two methods in WebSocket:
1. Send () sends data to the remote server
2. Close () closes the websocket link

WebSocket also defines several listener functions.
1. OnOpen triggers this event when a network connection is established
2. onerror triggers this event when a network error occurs
3. OnClose trigger This event when WebSocket is closed
4, OnMessage when the WebSocket received the message from the server to trigger the event, is also the most important communication in a listening event.


5. WebSocket also defines a readystate attribute:
1, connecting (0) WebSocket is trying to establish a connection to the server
2, OPEN (1) WebSocket and the server has established a connection
3, CLOSING (2) WebSocket shutting down the connection to the server
4, CLOSED (3) WebSocket has closed the connection to the server

A simple case of client-to-server communication

<! DOCTYPE html>

The direct browser opens the file to run.

Press F12 for a look.

The protocol is a WS-Protocol and the status is 101 connected.

Four, the following is the production of a simple chat room function

Need Nodejs for server background

Package.json file (download Nodejs-websocket module)

1234567891011121314 {  "name""demo2",  "version""1.0.0",  "description""",  "main""wsServer.js",  "scripts": {    "test""echo \"Error: no test specified\" && exit 1"  },  "author""",  "license""ISC",  "dependencies": {    "nodejs-websocket""^1.7.1"  }}
<! DOCTYPE html>

Wsserver.js

var ws = Require ("Nodejs-websocket"); var Clientcount=0;var server = Ws.createserver (function (conn) {    Console.log ("New connection")    clientcount++;    conn.nickname= ' user ' +clientcount;    Boradcast (conn.nickname+ ' comes in ');    Trigger    Conn.on ("Text", function (str) {        boradcast (conn.nickname+ ' says: ' +str ') after receiving the message from the server;    })    Close connection    Conn.on ("Close", function (code, reason) {        console.log ("Connection closed");        Boradcast (conn.nickname+ ' left ');    })    Conn.on ("Error", function (err) {        Console.log ("Handle err");        Console.log (err);    })}). Listen (8001); function Boradcast (str) {    Server.connections.forEach (function (connection) {        Connection.sendtext (str);}    )}

Run Node Wsserver.js

After running node, open the browser to browse the file directly, a file represents a user, so you can talk on both sides.

The new agreement of the H5 is still very interesting.

Recommend to see: http://www.imooc.com/learn/861 websocket case explanation.

Source: http://www.cnblogs.com/heyujun-/p/7563077.html

WebSocket agreement and case "turn"

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.