1.上图


2.引入jar包
<**dependency**>
<**groupId**>javax</**groupId**>
<**artifactId**>javaee-api</**artifactId**>
<**version**>7.0</**version**>
<**scope**>provided</**scope**>
</**dependency**>
3.java后台代码
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85
| package com.fb.controller.web; import java.io.IOException; import java.util.concurrent.CopyOnWriteArraySet; import javax.websocket.*; import javax.websocket.server.ServerEndpoint;
@ServerEndpoint("/websocket") public class MyWebSocket { private static int onlineCount = 0; private static CopyOnWriteArraySet<MyWebSocket> webSocketSet = new CopyOnWriteArraySet<MyWebSocket>(); private Session session;
@OnOpen public void onOpen(Session session){ this.session = session; webSocketSet.add(this); addOnlineCount(); System.out.println("有新连接加入!当前在线人数为" + getOnlineCount()); }
@OnClose public void onClose(){ webSocketSet.remove(this); subOnlineCount(); System.out.println("有一连接关闭!当前在线人数为" + getOnlineCount()); }
@OnMessage public void onMessage(String message, Session session) { System.out.println("来自客户端的消息:" + message); for(MyWebSocket item: webSocketSet){ try { item.sendMessage(message); } catch (IOException e) { e.printStackTrace(); continue; } } }
@OnError public void onError(Session session, Throwable error){ System.out.println("发生错误"); error.printStackTrace(); }
public void sendMessage(String message) throws IOException{ this.session.getBasicRemote().sendText(message); } public static synchronized int getOnlineCount() { return onlineCount; } public static synchronized void addOnlineCount() { MyWebSocket.onlineCount++; } public static synchronized void subOnlineCount() { MyWebSocket.onlineCount--; } }
|
4.前台代码
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64
| <html> <head> <title>websocket</title> </head> <body> Welcome<br/> <div id="message" style="color: blue">[状态]</div>
<br/>昵称: <input type="text" id="username"> <br/>内容: <input id="text" type="text"/> <br/> <button οnclick="send()">发送</button> <button οnclick="closeWebSocket()">关闭</button>
</body>
<script type="text/javascript"> var websocket = null; if ('WebSocket' in window) { websocket = new WebSocket("ws://localhost:9090/wanglh/websocket"); } else { alert('当前浏览器 Not support websocket') } websocket.onerror = function () { setMessageInnerHTML("WebSocket连接发生错误"); }; websocket.onopen = function () { setMessageInnerHTML("WebSocket连接成功"); } websocket.onmessage = function (event) { setMessageInnerHTML(event.data); } websocket.onclose = function () { setMessageInnerHTML("WebSocket连接关闭"); } window.onbeforeunload = function () { closeWebSocket(); } function setMessageInnerHTML(innerHTML) { document.getElementById('message').innerHTML += innerHTML + '<br/>'; } function closeWebSocket() { websocket.close(); } function send() { var username=document.getElementById('username').value; var message = document.getElementById('text').value; var msg="["+username+"]:"+message; websocket.send(msg); } </script> </html>
|