WebSocket message Push

Source: Internet
Author: User

The WebSocket protocol is a new network protocol based on TCP, and the application layer is a subset of TCP/IP protocol.

It implements browser-to-server full-duplex (Full-duplex) communication, and both clients and servers can send and receive data to each other proactively. After creating the WebSocket in JS, an HTTP request is sent to the browser to initiate the request. After the server response is obtained, the established connection uses an HTTP upgrade to convert the HTTP protocol to the WEBSOCKET protocol. That is, WebSocket cannot be implemented using the standard HTTP protocol, and only specialized browsers that support those protocols will work properly. Because Webscoket uses a custom protocol, the URL is slightly different from the HTTP protocol. The unencrypted connection is ws://, not http://. The encrypted connection is wss://, not https://.

Use:

Real-time Web application solutions that enable real-time communication of the Web.

Say more straightforward, HTML message push .

If you have a page, the data is not changed periodically, the usual practice is polling, polling refers to a specific time interval (such as every second), the browser to the server to initiate an HTTP request, and then the server returned data to the browser.

Because the HTTP protocol is inert, the server will return data only if the client initiates the request. The precondition for the implementation of polling technology is also based on this mechanism. While WebSocket belongs to the service-side push technology, the essence is an application layer protocol, which can realize the full duplex bidirectional communication of the persistent connection.

When there is a Web socket, the data changes when the server notifies the client, Kai is not wonderful?

Sample Request:

(1) The default port is 80 and 443 (SSL).

(2) The protocol identifier is WS and WS (SSL).

(3) Sample Request message

 General--------------------------------------------Request Url:ws://LOCALHOST:8080/J2EE-WEBSOCKET/WEBSOCKET/1Request method:getstatus Code:101Switching Protocols---------------------------------------------Response Headers---------------------------------------------Connection:upgradeDate:Tue, toDec .  on: A: $gmtsec-websocket-accept:crxt/xcopnsledb1kdydwxow+us=Sec-websocket-extensions:permessage-deflate;client_max_window_bits= theServer:apache-coyote/1.1Upgrade:websocket

Client-side JavaScript code:

<script type="Text/javascript">varWebSocket =NULL; varPrincipal ='1'; varSocketurl ='ws://'+Window.location.host+'/j2ee-websocket/websocket/'+principal; //determine if the current browser supports WebSocket      if('WebSocket' inchwindow) {WebSocket=NewWebSocket (Socketurl); }        Else{alert ('Not support WebSocket'); }                 //callback method where the connection error occurredWebsocket.onerror = function (Event) {alert ("Error");                 }; //callback method for successful connection establishmentWebsocket.onopen =function () {alert ("Open"); }                 //callback method for receiving messageWebsocket.onmessage = function (Event) {alert ('recive:'+Event. Data); }                 //callback method for connection shutdownWebsocket.onclose = function (Event) {alert ("Close"); }                 //Send Messagefunction Send (message) {websocket.send (message); }    </script>

Recommendation: Google/jquery-websocket Code (HTTP://CODE.GOOGLE.COM/P/JQUERY-WEBSOCKET)

Google/jquery-websocket added the message type, splitting the message into {"Type": "", "Message": ""}.

This is more flexible and can be defined according to the type of business, such as: Notice, announcement, broadcast, post, etc...

<script type="Text/javascript">varPrincipal ='1'; varSocketurl ='ws://'+Window.location.host+'/j2ee-websocket/websocket/'+principal; WebSocket=$.websocket (Socketurl, {open:function () {//When the socket opensAlert"Open"); }, Close:function () {//When the socket closesAlert"Close"); },            //receive message processing for server-side pushevents: {'Radio': Function (Event) {console.info ($.parsejson (Event. Data)); },                'Notice': Function (Event) {console.info ($.parsejson (Event. Data)); },                //... more custom type of message            }        }); //Send Messagefunction Send () {Websocket.send ('Radio',"hello,this msg from client request"); }    </script>

WebSocket message Push

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.