通用的websocket模板代码

web聊天室后端代码模板:

package com.jsx.chat;import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;
import java.util.concurrent.CopyOnWriteArraySet;import javax.websocket.OnClose;
import javax.websocket.OnError;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;import net.sf.json.JSONObject;@ServerEndpoint("/websocket/{userId}")
public class ChatServer {private static final SimpleDateFormat DATE_FORMAT = new SimpleDateFormat("yyyy-MM-dd HH:mm");   // 日期格式化//静态变量，用来记录当前在线连接数。应该把它设计成线程安全的。private static int onlineCount = 0;//concurrent包的线程安全Set，用来存放每个客户端对应的MyWebSocket对象。若要实现服务端与单一客户端通信的话，可以使用Map来存放，其中Key可以为用户标识private static CopyOnWriteArraySet<ChatServer> webSocketSet = new CopyOnWriteArraySet<ChatServer>();//与某个客户端的连接会话，需要通过它来给客户端发送数据private Session session;private String userId;//----------单聊---------用户id和websocket的session绑定的路由表//@SuppressWarnings("rawtypes")//private static Map routeTable = new HashMap<>();/*** 连接建立成功调用的方法* @param session  可选的参数。session为与某个客户端的连接会话，需要通过它来给客户端发送数据*/@OnOpenpublic void open(@PathParam("userId")String userIds,Session session) {// 添加初始化操作System.out.println("---初始化----userId:"+userIds);this.session = session;//获取当前登录用户的idthis.userId = userIds;webSocketSet.add(this);     //加入set中addOnlineCount();           //在线数加1System.out.println("有新连接加入！当前在线人数为" + getOnlineCount());//---------单聊-----------将用户id和session绑定到路由表//绑定之后就可以在其它地方根据id来获取session，这时两个用户私聊就可以实现了//routeTable.put(userId, session);}/*** 接受客户端的消息，并把消息发送给所有连接的会话* @param message 客户端发来的消息* @param session 客户端的会话*/@OnMessagepublic void getMessage(String message, Session session1) {// 把客户端的消息解析为JSON对象JSONObject jsonObject = JSONObject.fromObject(message);// 在消息中添加发送日期jsonObject.put("date", DATE_FORMAT.format(new Date()));// -----------------------把消息发送给所有连接的会话--------------------------------System.out.println("来自客户端的消息"+this.userId+":" + message);for(ChatServer item: webSocketSet){try {//当前用户右侧显示，非本用户左侧显示if(this.userId.equals(item.userId)){jsonObject.put("isSelf", true);}else{jsonObject.put("isSelf", false);}// 发送JSON格式的消息item.sendMessage(jsonObject.toString());} catch (IOException e) {e.printStackTrace();continue;}}//--------------群发2-------------------
//        for (Session sess : session.getOpenSessions()) {
//            if (sess.isOpen())
//               sess.getBasicRemote().sendText(msg);
//        }}@OnClosepublic void close() {// 添加关闭会话时的操作webSocketSet.remove(this);  //从set中删除subOnlineCount();           //在线数减1System.out.println("有一连接关闭！当前在线人数为" + getOnlineCount());}@OnErrorpublic void error(Throwable t) {// 添加处理错误的操作System.out.println("发生错误");t.printStackTrace();}/*** 这个方法与上面几个方法不一样。没有用注解，是根据自己需要添加的方法。* @param message json消息* @throws IOException*/public synchronized  void  sendMessage(String message) throws IOException{this.session.getAsyncRemote().sendText(message);//非阻塞式的}public static synchronized int getOnlineCount() {return onlineCount;}public static synchronized void addOnlineCount() {ChatServer.onlineCount++;}public static synchronized void subOnlineCount() {ChatServer.onlineCount--;}}

前端部分：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>即时群聊</title>
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="alternate icon" href="assets/i/favicon.ico">
<link rel="stylesheet" href="assets/css/amazeui.min.css">
<link rel="stylesheet" href="assets/css/app.css">
<link href="umeditor/themes/default/css/umeditor.css" rel="stylesheet">
<style>
.title {text-align: center;
}
.chat-content-container {height: 29rem;overflow-y: scroll;border: 1px solid silver;
}
</style>
</head>
<body><!-- 标题 --><div class="title"><div class="am-g am-g-fixed"><div class="am-u-sm-12"><h1 class="am-text-primary">群聊</h1></div></div></div><!-- 聊天内容框开始 --><div class="chat-content"><div class="am-g am-g-fixed chat-content-container"><div class="am-u-sm-12"><ul id="message-list" class="am-comments-list am-comments-list-flip"></ul></div></div></div><!-- 聊天内容框结束 --><div class="message-input am-margin-top"><!-- 输入内容框开始 --><div class="am-g am-g-fixed"><div class="am-u-sm-12"><form class="am-form"><div class="am-form-group"><script type="text/plain" id="myEditor" style="width: 100%;height: 8rem;"></script></div></form></div></div><!-- 输入昵称框开始 --><div class="am-g am-g-fixed am-margin-top"><div class="am-u-sm-6"><div id="message-input-nickname" class="am-input-group am-input-group-primary"><span class="am-input-group-label"><i class="am-icon-user"></i></span><input id="nickname" type="text" class="am-form-field" placeholder="Please enter nickname"/></div></div><div class="am-u-sm-6"><button id="send" type="button" class="am-btn am-btn-primary"><i class="am-icon-send"></i>发送</button></div></div></div><script src="assets/js/jquery.min.js"></script><script charset="utf-8" src="umeditor/umeditor.config.js"></script><script charset="utf-8" src="umeditor/umeditor.min.js"></script><script src="umeditor/lang/zh-cn/zh-cn.js"></script><script>$(function() {//随机方法   生成id模拟用户function rand(num){return parseInt(Math.random()*1000000+1);}// 初始化消息输入框var um = UM.getEditor('myEditor');// 使昵称框获取焦点$('#nickname')[0].focus();// 新建WebSocket对象，最后的/WebSocket跟服务器端的@ServerEndpoint("/websocket")对应//var socket = new WebSocket('ws://${pageContext.request.getServerName()}:${pageContext.request.getServerPort()}${pageContext.request.contextPath}/websocket');//var socket = new WebSocket("ws://localhost:8080/Chat/websocket");var target = "ws://"+window.location.host+"/Chat/websocket"+"/"+rand();//alert(target);var socket = new WebSocket(target);// 处理服务器端发送的数据socket.onmessage = function(event) {addMessage(event.data);};// 点击Send按钮时的操作$('#send').on('click', function() {var nickname = $('#nickname').val();//alert(um.getContent()); //内容//alert(nickname);  //昵称if (!um.hasContents()) {    // 判断消息输入框是否为空// 消息输入框获取焦点um.focus();// 添加抖动效果$('.edui-container').addClass('am-animation-shake');setTimeout("$('.edui-container').removeClass('am-animation-shake')", 1000);} else if (nickname == '') {    // 判断昵称框是否为空//昵称框获取焦点$('#nickname')[0].focus();// 添加抖动效果$('#message-input-nickname').addClass('am-animation-shake');setTimeout("$('#message-input-nickname').removeClass('am-animation-shake')", 1000);} else {// 发送消息socket.send(JSON.stringify({content : um.getContent(),nickname : nickname}));// 清空消息输入框um.setContent('');// 消息输入框获取焦点um.focus();}});// 把消息添加到聊天内容中function addMessage(message) {message = JSON.parse(message);var messageItem = '<li class="am-comment '+ (message.isSelf ? 'am-comment-flip' : 'am-comment')+ '">'+ '<a href="javascript:void(0)" ><img src="assets/images/'+ (message.isSelf ? 'self.jpg' : 'others.jpg')+ '" alt="" class="am-comment-avatar" width="48" height="48"/></a>'+ '<div class="am-comment-main"><header class="am-comment-hd"><div class="am-comment-meta">'+ '<a href="javascript:void(0)" class="am-comment-author">'+ message.nickname + '</a> <time>' + message.date+ '</time></div></header>'+ '<div class="am-comment-bd">' + message.content+ '</div></div></li>';$(messageItem).appendTo('#message-list');// 把滚动条滚动到底部$(".chat-content-container").scrollTop($(".chat-content-container")[0].scrollHeight);}});</script></body>
</html>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/509305.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

最终排名

最终排名

Time Limit: 1000MS Memory Limit: 65536KBSubmit StatisticProblem Description 第四届山东理工大学ACM网络编程擂台赛比赛完后需要产生一个最终排名&#xff0c;排名按照题数多少来决定。但是有太多的队伍参与&#xff0c;手动计算排名已经不能满足比赛的需求。现在有一份名单…
阅读更多...
windows稀疏文件

windows稀疏文件

稀疏文件(Sparse File), 指的是文件中出现大量的0数据&#xff0c;这些数据对我们用处不大&#xff0c;但是却一样的占用我们的空间&#xff0c;针对此&#xff0c;WINNT 3.51中的NTFS文件系统对此进行了优化&#xff0c;那些无用的0字节被用一定的算法压缩起来&#xff0c;使得…
阅读更多...
设置三个线程顺序打印数字问题(转载)

设置三个线程顺序打印数字问题(转载)

第一种方法&#xff1a;通过共享对象锁的方式实现 记住调用wait方法时候需要在同步代码块内&#xff0c;否则会报java.lang.IllegalMonitorStateException异常&#xff01; package com.test;class Prints {public int num 0;synchronized public void methodA() throws Int…
阅读更多...
英文金曲大赛

英文金曲大赛

Problem Description 我们在“渊子数”的题目中已经了解了渊子是个什么样的人了&#xff0c;他在大一的时候参加过工商学院的“英语聚乐部”。告诉你个秘密&#xff0c;这个俱乐部是个好地方&#xff0c;不但活动精彩而且有MM。这不&#xff0c;英语俱乐部举办了一个叫做“英文…
阅读更多...
磁盘管理之逻辑卷管理（Logical Volume Manager）

磁盘管理之逻辑卷管理（Logical Volume Manager）

LVM是逻辑卷管理&#xff08;Logical Volume Manager&#xff09;的简称&#xff0c;它是建立在物理存储设备之上的一个抽象层&#xff0c;允许你生成逻辑存储卷,与直接使用物理存储在管理上相比,提供了更好灵活性。 LVM将存储虚拟化,使用逻辑卷,你不会受限于物理磁盘的大小,另…
阅读更多...
单链表头插法与尾插法的c语言实现(回顾)

单链表头插法与尾插法的c语言实现(回顾)

#include<stdio.h> #include<math.h> #include<stdlib.h> typedef struct node{int data;node *next; }; int main() {node *head NULL;node *tail NULL;node *p NULL;p (node *)malloc(sizeof(node));if(pNULL){printf("%s","没有足够的…
阅读更多...
磁盘“簇”

磁盘“簇”

“簇”是DOS进行分配的最小单位。当创建一个很小的文件时&#xff0c;如是一个字节&#xff0c;则它在磁盘上并不是只占一个字节的空间&#xff0c;而是占有整个一簇。DOS视不同的存储介质&#xff08;如软盘&#xff0c;硬盘&#xff09;&#xff0c;不同容量的硬盘&#xff0…
阅读更多...
选夫婿1

选夫婿1

Problem Description 倾国倾城的大家闺秀潘小姐要选夫婿啦&#xff01;武林中各门各派&#xff0c;武林外各大户人家&#xff0c;闻讯纷纷前来&#xff0c;强势围观。前来参与竞选的男生藏龙卧虎&#xff0c;高手云集&#xff0c;才子遍布&#xff0c;帅哥纷纭&#xff0c;更不…
阅读更多...
找出二维数组中每行的最小数但最小数的列不能相同

找出二维数组中每行的最小数但最小数的列不能相同

现有一个M*N的表格&#xff0c;请统计表格中每行最小数值之和。要求最小数的都在不同列中&#xff0c; 既假设第一行第一列数是最小数&#xff0c;那即使第二行第一列的数在第二行中不去计算。 example: 存在如下表格&#xff1a; 1 2 3 2 4 5 则&#xff1a; 第一行最小…
阅读更多...
Qt实现Word文档界面样式--QtitanRibbon

Qt实现Word文档界面样式--QtitanRibbon

QtitanRibbon - Microsoft Ribbon for Nokias Qt概念的实现 QtitanRibbon组件实现了Microsoft Ribbon for Qt的概念&#xff0c;设计用于任何使用Qt开发的商业应用。这个组件和Qt一道为获取一些应用提供了一个难得的机会&#xff0c;这些应用在全球三大主要平台Windows、Linux和…
阅读更多...
选夫婿2

选夫婿2

Problem Description 倾国倾城的大家闺秀潘小姐要选夫婿啦&#xff01;武林中各门各派&#xff0c;武林外各大户人家&#xff0c;闻讯纷纷前来&#xff0c;强势围观。前来参与竞选的男生藏龙卧虎&#xff0c;高手云集&#xff0c;才子遍布&#xff0c;帅哥纷纭&#xff0c;更不…
阅读更多...
Unity3d访问数据库

Unity3d访问数据库

找到System.Data.dll文件&#xff0c;默认的地址是在C:\Program Files\Unity\Editor\Data\Mono\lib\mono\unity&#xff0c;这个根据你所安装的路径有关。 2、将该文件复制到你的工作空间下的Asset文件夹内 3、在你的编辑器中添加引用&#xff0c;我用的是VS 4、在命名空间内
阅读更多...
轻松反编译C#的DLL

轻松反编译C#的DLL

深入了解Unity&#xff0c;需要知道它内部是怎样工作的&#xff0c;API的代码长什么样&#xff0c;本文以UnityEditor.dll为例&#xff0c;演示如何轻松搞定C#库的反编译。 使用的软件是jetbrains系的doPeek&#xff0c;.NET Reflector 9.0也能做同样的工作&#xff0c;但不太推…
阅读更多...
商人的诀窍

商人的诀窍

Problem Description E_star和von是中国赫赫有名的两位商人&#xff0c;俗话说的好无商不奸&#xff0c;最近E_star需要进一批苹果。可是他需要的苹果只有von才有&#xff0c;von的苹果都存在他的传说中很牛叉的仓库里&#xff0c;每个仓库都存了不同种类的苹果&#xff0c;而且…
阅读更多...
训练总结(大一下)

训练总结(大一下)

ACM训练总结写这次的训练总结也就意味着这个学期快要结束了&#xff0c;“光阴似箭&#xff0c;日月如梭”&#xff0c;总觉得时间过得很快反而学的很少&#xff0c;但是这个学期待在ACM还是有收获的&#xff0c;从开学接触链表时候的一脸茫然 &#xff0c;到现在已经学完了线段…
阅读更多...
来淄博旅游

来淄博旅游

Problem Description 淄博某旅行社每天都要接待来自全国各地的游客&#xff0c;他们从各个城市来到张店区&#xff0c;游玩后又去淄博的其他旅游景点。从各个城市来张店的游客只是在网上报名&#xff0c;然后旅行社根据统计的人数&#xff0c;用大巴把他们从不同城市拉到张店。…
阅读更多...
UTF-8中的BOM-带还是不带？

UTF-8中的BOM-带还是不带？

转自&#xff1a;http://blog.csdn.net/fanpei_moukoy/article/details/21464305 UTF-8 不需要 BOM&#xff0c;尽管 Unicode 标准允许在 UTF-8 中使用 BOM。所以不含 BOM 的 UTF-8 才是标准形式&#xff0c;在 UTF-8 文件中放置 BOM 主要是微软的习惯&#xff08;顺便提一下&a…
阅读更多...
ACM训练总结(大二)

ACM训练总结(大二)

时光飞速&#xff0c;不知不觉&#xff0c;现在是第三次写总结报告了&#xff0c;第一次的解题报告是在大一上学期的期末&#xff0c;那时候是满怀信心、充满斗志&#xff0c;觉得以后肯定在ACM这条路上有所作为&#xff0c;记得那次写解题报告的主要内容是一个自我提醒、自我激…
阅读更多...
递归的函数

递归的函数

Problem Description 给定一个函数 f(a, b, c)&#xff1a;如果 a ≤ 0 或 b ≤ 0 或 c ≤ 0 返回值为 1&#xff1b;如果 a > 20 或 b > 20 或 c > 20 返回值为 f(20, 20, 20)&#xff1b;如果 a < b 并且 b < c 返回 f(a, b, c−1) f(a, b−1, c−1) − f(a,…
阅读更多...
Qt5中文乱码解决方案

Qt5中文乱码解决方案

升级到Qt5.X之后&#xff0c;原先解决的Qt显示中文乱码的方法突然不适用了&#xff0c;找了很多方式来解决这个问题 第一种&#xff1a; 在公司代码里看到的方法&#xff0c;先将对应的cpp文件用windows自带的记事本打开&#xff0c;另存为UTF-8格式&#xff0c;然后在代码中&a…
阅读更多...
最新文章

Copyright @ 2022~2023