With the development of the Internet, traditional HTTP protocols have been difficult to meet the increasingly complex needs of Web applications. In recent years, with the birth of HTML5, the WebSocket protocol has been proposed. It realizes full-duplex communication between the browser and the server, expands the communication function between the browser and the server, and enables the server to actively send data to the client.
The traditional HTTP protocol is stateless. Each request must be initiated by the client (such as a browser). After processing, the server returns the response result. It is difficult for the server to actively send data to the client. This kind of client is the active party and the server is the passive party. The traditional web model causes less trouble for web applications with infrequent information changes, but it brings great inconvenience to web applications involving real-time information, such as applications with functions such as instant communication, real-time data, subscription push, etc. Before the WebSocket specification was proposed, developers often use trade-off solutions to implement these highly real-time functions: polling and Comet technologies. In fact, the latter is essentially a kind of polling, but it has been improved.
Polling is the most original solution to implement real-time web applications. Polling technology requires clients to periodically send requests to the server at a set time interval and frequently query whether there are new data changes. Obviously, this approach can lead to too many unnecessary requests, wasting traffic and server resources.
Comet technology can be divided into long polling and streaming technology. Long polling improves the above-mentioned polling technology, reducing useless requests. It sets an expiration time for certain data, and only sends a request to the server after the data expires; this mechanism is suitable for situations where data changes are not particularly frequent. Streaming technology usually refers to the client using a hidden window to establish an HTTP long connection with the server. The server will constantly update the connection status to keep the HTTP long connection alive; in this way, the server can actively send data to the client through this long connection; streaming technology may test the performance of the server in a large concurrency environment.
Both technologies are based on the request-response mode and are not considered real-time technologies in the true sense; each request or response of their wastes a certain amount of traffic on the same header information, and the development complexity is also high.
**Along with the launch of HTML5, WebSocket truly realizes real-time communication of the web, making the B/S mode have the real-time communication capabilities of C/S mode. **The workflow of WebSocket is as follows: the browser sends a request to the server to establish a WebSocket connection through JavaScript. After the WebSocket connection is successfully established, the client and the server can transmit data through the TCP connection. Because WebSocket connection is essentially a TCP connection, it does not require repeated header data to be carried with each transmission, so its data transmission volume is much smaller than polling and Comet technology. This article does not introduce the WebSocket specification in detail, but mainly introduces the implementation of WebSocket in Java Web, and uses WebSocket to implement a chat room.
JavaEE 7 has created JSR-356:Java API for WebSocket specification. Many web containers, such as Tomcat, Nginx, Jetty, etc., support WebSocket. Tomcat supports WebSocket since 7.0.27 and JSR-356 since 7.0.47. The following code must also be run on Tomcat7.0.27 or above.
WebSocket server code
//This annotation is used to specify a URI, through which the client can connect to the WebSocket. Servlet-like annotation mapping. No need to configure it in web.xml. @ServerEndpoint("/webSocket")public class WebSocketDemo { // Static variable used to record the current number of online connections. It should be designed to be thread-safe. private static final AtomicInteger onlineCount = new AtomicInteger(0); // The thread-safe Set of the concurrent package is used to store the corresponding MyWebSocket object of each client. To realize that the server communicates with a single client, you can use Map to store it, where the Key can identify private static CopyOnWriteArraySet<WebSocketDemo> webSocketSet = new CopyOnWriteArraySet<WebSocketDemo>(); //Define a chat nickname that records the client's chat nickname private final String nickname; //Connect a connection session with a certain client, and you need to send data to the client private Session session; public WebSocketDemo() { nickname = "Guest" + onlineCount.getAndIncrement(); } /* * Use the @Onopen annotation to indicate the return after the client link is successful. Parameter Session is optional Parameter This Session is a session in the WebSocket specification, representing a session. Not HttpSession */ @OnOpen public void onOpen(Session session) { this.session = session; webSocketSet.add(this); String message = String.format("[%s,%s]",nickname,"Add to chat room"); broadcast(message); System.out.println("onOpen"); }/* *Use the @OnMessage annotation to indicate when the client sends a message and the first parameter indicates the data sent by the user. The parameter Session is an optional parameter, which is consistent with the session in the OnOpen method */ @OnMessage public void onMessage(String message,Session session){ //Of course true System.out.println(this.session==session); broadcast(String.format("%s:%s",nickname,filter(message))); }/**Callback after the user breaks the link, note that this method must be called after the client calls the broken link method */ @OnClose public void onClose() { webSocketSet.remove(this); String message = String.format("[%s,%s]",nickname,"Leave the chat room link"); broadcast(message); } //Complete mass sending private void broadcast(String info){ for(WebSocketDemo w:webSocketSet){ try { synchronized (WebSocketDemo.class) { w.session.getBasicRemote().sendText(info); } } catch (IOException e) { System.out.println("Send message to client"+w.nickname+"Failed to send a message"); webSocketSet.remove(w); try { w.session.close(); } catch (IOException e1) {} String message = String.format("[%s,%s]",w.nickname,"Disconnected"); broadcast(message); } } } //Can make some filtering requests for user messages, such as blocking keywords, etc. . . public static String filter(String message){ if(message==null){ return null; } return message; }}Client (Web homepage) code:
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><script type="text/javascript"> var ws = new WebSocket("ws://localhost:8080/WebSocketTest/webSocket"); /* * Listen to changes in three states. js will callback*/ ws.onopen = function(message) { }; ws.onclose = function(message) { }; ws.onmessage = function(message) { showMessage(message.data); }; // Listen to the window closing event. When the window is closed, actively close the websocket connection to prevent the window from closing before the connection is disconnected, and the server side will throw exceptions. window.onbeforeunload = function() { ws.close(); }; //Close the connection function closeWebSocket() { ws.close(); } //Send a message function send() { var input = document.getElementById("msg"); var text = input.value; ws.send(text); input.value = ""; } function showMessage(message) { var text = document.createTextNode(message); var br = document.createElement("br") var div = document.getElementById("showChatMessage"); div.appendChild(text); div.appendChild(br); }</script></head><body> <div id="show"> <div id="showChatMessage"></div> <input type="text" size="80" id="msg" name="msg" placeholder="enter chat content" /> <input type="button" value="send" id="sendBn" name="sendBn" name="sendBn" onclick="send()"></body></html>As mentioned above, a chat room with group chat function is completed. During the verification process, it was found that using WebSocket can complete cross-domain requests.
The above is all the content of this article. I hope it will be helpful to everyone's learning and I hope everyone will support Wulin.com more.