只需要两个文件即可，一个服务端，一个前端，一下示例为模拟简单的聊天程序：

服务端：

  1. package com.test.websocket;
  2.  
  3. import java.io.IOException;
  4. import java.util.concurrent.CopyOnWriteArraySet;
  5.  
  6. import javax.websocket.OnClose;
  7. import javax.websocket.OnError;
  8. import javax.websocket.OnMessage;
  9. import javax.websocket.OnOpen;
  10. import javax.websocket.Session;
  11. import javax.websocket.server.ServerEndpoint;
  12.  
  13. @ServerEndpoint("/chat")
  14. public class MyWebSocket {
  15.  
  16.     //静态变量，用来记录当前在线连接数。应该把它设计成线程安全的。
  17.     private static int onlineCount = 0;
  18.  
  19.     //concurrent包的线程安全Set，用来存放每个客户端对应的MyWebSocket对象。若要实现服务端与单一客户端通信的话，可以使用Map来存放，其中Key可以为用户标识
  20.     private static CopyOnWriteArraySet<MyWebSocket> webSocketSet = new CopyOnWriteArraySet<MyWebSocket>();
  21.  
  22.     //与某个客户端的连接会话，需要通过它来给客户端发送数据
  23.     private Session session;
  24.  
  25.     /**
  26.      * 连接建立成功调用的方法
  27.      * @param session  可选的参数。session为与某个客户端的连接会话，需要通过它来给客户端发送数据
  28.      */
  29.     @OnOpen
  30.     public void onOpen(Session session){
  31.         this.session = session;
  32.         webSocketSet.add(this);     //加入set中
  33.         addOnlineCount();           //在线数加1
  34.         System.out.println("有新连接加入！当前在线人数为" + getOnlineCount());
  35.     }
  36.  
  37.     /**
  38.      * 连接关闭调用的方法
  39.      */
  40.     @OnClose
  41.     public void onClose(){
  42.         webSocketSet.remove(this);  //从set中删除
  43.         subOnlineCount();           //在线数减1
  44.         System.out.println("有一连接关闭！当前在线人数为" + getOnlineCount());
  45.     }
  46.  
  47.     /**
  48.      * 收到客户端消息后调用的方法
  49.      * @param message 客户端发送过来的消息
  50.      * @param session 可选的参数
  51.      */
  52.     @OnMessage
  53.     public void onMessage(String message, Session session) {
  54.         System.out.println("来自客户端的消息:" + message);
  55.  
  56.         //群发消息
  57.         for(MyWebSocket item: webSocketSet){
  58.             try {
  59.                 item.sendMessage(message);
  60.             } catch (IOException e) {
  61.                 e.printStackTrace();
  62.                 continue;
  63.             }
  64.         }
  65.     }
  66.  
  67.     /**
  68.      * 发生错误时调用
  69.      * @param session
  70.      * @param error
  71.      */
  72.     @OnError
  73.     public void onError(Session session, Throwable error){
  74.         System.out.println("发生错误");
  75.         error.printStackTrace();
  76.     }
  77.  
  78.     /**
  79.      * 这个方法与上面几个方法不一样。没有用注解，是根据自己需要添加的方法。
  80.      * @param message
  81.      * @throws IOException
  82.      */
  83.     public void sendMessage(String message) throws IOException{
  84.         this.session.getBasicRemote().sendText(message);
  85.         //this.session.getAsyncRemote().sendText(message);
  86.     }
  87.  
  88.     public static synchronized int getOnlineCount() {
  89.         return onlineCount;
  90.     }
  91.  
  92.     public static synchronized void addOnlineCount() {
  93.         MyWebSocket.onlineCount++;
  94.     }
  95.  
  96.     public static synchronized void subOnlineCount() {
  97.         MyWebSocket.onlineCount--;
  98.     }
  99.  
  100. }

前端：

  1. <html>
  2. <body>
  3.  
  4.     Welcome<br/>
  5.     <input id="text" type="text" />
  6.     <button onclick="send()">Send</button>
  7.     <button onclick="closeWebSocket()">Close</button>
  8.     <div id="message"></div>
  9.  
  10. </body>
  11.  
  12. <script type="text/JavaScript">
  13.       var websocket = null;
  14.  
  15.       //判断当前浏览器是否支持WebSocket
  16.       if('WebSocket' in window){
  17.           websocket = new WebSocket("ws://localhost:8072/worktest/chat");
  18.       }
  19.       else{
  20.           alert('Not support websocket');
  21.       }
  22.       //连接发生错误的回调方法
  23.       websocket.onerror = function(){
  24.           setMessageInnerHTML("error");
  25.       };
  26.       //连接成功建立的回调方法
  27.       websocket.onopen = function(event){
  28.           setMessageInnerHTML("open");
  29.       };
  30.       //接收到消息的回调方法
  31.       websocket.onmessage = function(){
  32.           setMessageInnerHTML(event.data);
  33.       };
  34.       //连接关闭的回调方法
  35.       websocket.onclose = function(){
  36.           setMessageInnerHTML("close");
  37.       };
  38.       //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
  39.       window.onbeforeunload = function(){
  40.           websocket.close();
  41.       };
  42.       //将消息显示在网页上
  43.       function setMessageInnerHTML(innerHTML){
  44.           document.getElementById('message').innerHTML += innerHTML + '<br/>';
  45.       }
  46.       //关闭连接
  47.       function closeWebSocket(){
  48.           websocket.close();
  49.       }
  50.       //发送消息
  51.       function send(){
  52.           var message = document.getElementById('text').value;
  53.           websocket.send(message);
  54.       }
  55.   </script>
  56.  
  57. </html>

websocket简单实例的更多相关文章

  1. html5+go+websocket简单实例代码

    这次的就直接发放代码截图吧,应该是用go语言做后台一个简易的聊天,这里没用到什么特别的知识,最朴实的来实现效果,主要目的是分享下h5怎么用websocket,go搭建websocket服务的主要部分. ...

  2. 基于H5的WebSocket简单实例

    客户端代码: <html> <head> <script> var socket; if ("WebSocket" in window) { v ...

  3. SignalR代理对象异常：Uncaught TypeError: Cannot read property 'client' of undefined 推出的结论 SignalR 简单示例 通过三个DEMO学会SignalR的三种实现方式 SignalR推送框架两个项目永久连接通讯使用 SignalR 集线器简单实例2 用SignalR创建实时永久长连接异步网络应用程序

    SignalR代理对象异常:Uncaught TypeError: Cannot read property 'client' of undefined 推出的结论   异常汇总:http://www ...

  4. websocket简单入门

    今天说起及时通信的时候,突然被问到时用推的方式,还是定时接受的方式,由于之前页面都是用传统的ajax处理,可能对ajax的定时获取根深蒂固了,所以一时之间没有相同怎么会出现推的方式呢?当被提及webs ...

  5. Hibernate(二)__简单实例入门

    首先我们进一步理解什么是对象关系映射模型? 它将对数据库中数据的处理转化为对对象的处理.如下图所示: 入门简单实例: hiberante 可以用在 j2se 项目,也可以用在 j2ee (web项目中 ...

  6. 最新 Eclipse IDE下的Spring框架配置及简单实例

    前段时间开始着手学习Spring框架,又是买书又是看视频找教程的,可是鲜有介绍如何配置Spring+Eclipse的方法,现在将我的成功经验分享给大家. 本文的一些源代码来源于码农教程:http:// ...

  7. 修改js confirm alert 提示框文字的简单实例

    修改js confirm alert 提示框文字的简单实例: <!DOCTYPE html> <html> <head lang="en"> & ...

  8. Websocket简单例子

    websocket是Html5的一个协议,也就是说距离我们2016年就几年时间,其他原理我就不说了,直接讲例子 一.准备材料:1.一个开发工具必须支持javaEE7的,原因是javaEE6或以下不支持 ...

  9. 利用navicat创建存储过程、触发器和使用游标的简单实例

    利用navicat创建存储过程.触发器和使用游标的简单实例 标签: navicat存储过程触发器mysql游标 2013-08-03 21:34 15516人阅读 评论(1) 收藏 举报  分类: 数 ...

随机推荐

  1. C#图片水印代码整理

    这一段公司有个项目,客户要求上传的图片要带上自定义的水印.以前也经常和朋友讨论C#图片水印方面的问题,但是从来没有实际操作过.所以,借这次项目的机会也研究了一下C#图片水印的功能!本人参考的是disc ...

  2. Power BI连接SSAS(微软的分析服务)进行权限控制（本地部署）

    尬聊...... 在干活之前先尬聊一会儿 丸子我在10月下旬左右就开始弄power BI连接SSAS进行权限控制的问题,中间也是历经波折,看了网上很多资料,可是都是SSAS怎么进行权限控制,没有SSA ...

  3. ImageMagick图片服务器

    1.前置准备工具如下: nodejs express(nodejs mvc框架) body-parser(express middleware) gm(nodejs中用来处理图片的) uuid(nod ...

  4. netty（三） 组件介绍

    netty各组件说明:channel ----- SocketEventLoop -------控制流,多线程处理,并发channelFuture ------- 异步通知 channel:主要是实现 ...

  5. Webstorm下安装ESLint检测JS代码

    今天配置下Webstorm下面的Eslint, 先看下本地安装的Node,NPM版本,2017-11-23日这个节点最新版本. >node -v v8.9.1 >npm -v 使用Webs ...

  6. 如何用webgl(three.js)搭建一个3D库房-第一课

    今天我们来讨论一下如何使用当前流行的WebGL技术搭建一个库房并且实现实时有效交互 第一步.搭建一个3D库房首先你得知道库房长啥样,我们先来瞅瞅库房长啥样(这是我在网上找的一个库房图片,百度了“库房” ...

  7. css3实现聊天气泡

    1: <div class="comment"></div><style type="text/css"> .comment ...

  8. 《java.util.concurrent 包源码阅读》08 CopyOnWriteArrayList和CopyOnWriteArraySet

    CopyOnWriteArrayList和CopyOnWriteArraySet从数据结构类型上来说是类似的,都是用数组实现的保存一组数据的数据结构,区别也简单就是List和set的区别.因此这里就先 ...

  9. 网站图片挂马检测及PHP与python的图片文件恶意代码检测对比

    前言 周一一早网管收到来自阿里云的一堆警告,发现我们维护的一个网站下有数十个被挂马的文件.网管直接关了vsftpd,然后把警告导出邮件给我们. 取出部分大致如下: 服务器IP/名称 木马文件路径 更新 ...

  10. memcached 缓存数据库应用实践

    1.1 数据库对比 缓存: 将数据存储到内存中,只有当磁盘胜任不了的时候,才会启用缓存   缺点:断电数据丢失(双电),用缓存存储数据的目的只是为了应付大并发的业务. 数据库: mysql(关系型数据 ...