一、WebSocket与HTTP长轮询

  WebSocket 属于HTML5 规范的一部分,提供的一种在单个 TCP 连接上进行全双工通讯的协议。允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。(Tomcat 8以上版本支持)

  HTTP 协议是一种无状态的、无连接的、单向的应用层协议。它采用了请求/响应模型。通信请求只能由客户端发起,服务端对请求做出应答处理。这种通信模型有一个弊端:HTTP 协议无法实现服务器主动向客户端发起消息。

  HTTP长轮询:客户端向服务器发送(http)Ajax请求,服务器接到请求后hold住连接,直到有新消息才返回响应信息并关闭连接,客户端处理完响应信息后再向服务器发送新的请求。

  WebSocket与HTTP长轮询的通信机制如下:

  

二、客户端如何使用WebSocket

  浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以通过 TCP 连接直接交换数据。

  当你获取 Web Socket 连接后,你可以通过 send() 方法来向服务器发送数据,并通过 onmessage 事件来接收服务器返回的数据。

1. 创建 WebSocket 对象API

  //第一个参数 url, 指定连接的 URL。第二个参数 protocol 是可选的,指定了可接受的子协议。  

  API:var webSocket = new WebSocket(url, [protocol] );

2. WebSocket 属性

以下是 WebSocket 对象的属性。假定我们使用了以上代码创建了 Socket 对象:

属性 描述
Socket.readyState

只读属性 readyState 表示连接状态,可以是以下值:

  • 0 - 表示连接尚未建立。

  • 1 - 表示连接已建立,可以进行通信。

  • 2 - 表示连接正在进行关闭。

  • 3 - 表示连接已经关闭或者连接不能打开。

Socket.bufferedAmount

只读属性 bufferedAmount 已被 send() 放入正在队列中等待传输,但是还没有发出的 UTF-8 文本字节数。

3. WebSocket 事件

以下是 WebSocket 对象的相关事件。假定我们使用了以上代码创建了 Socket 对象:

事件 事件处理程序 描述
open Socket.onopen 连接建立时触发
message Socket.onmessage 客户端接收服务端数据时触发
error Socket.onerror 通信发生错误时触发
close Socket.onclose 连接关闭时触发

4. WebSocket 方法

以下是 WebSocket 对象的相关方法。假定我们使用了以上代码创建了 Socket 对象:

方法 描述
Socket.send()

使用连接发送数据

Socket.close()

关闭连接

5. WebSocket 实例

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
<script type="text/javascript" src="../js/jquery.min.js"></script> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Testing WebSocket</title>
</head>
<script type="text/javascript">
var webSocket;
$(document).ready(function() {
//var IP = window.location.host;
var url = "ws://your IP/demo/ws/websocket";
//判断当前浏览器是否支持WebSocket
if ('WebSocket' in window) {
//建立客户端websocket
webSocket = new WebSocket(url);
} else {
console.log("您的浏览器不支持WebSocket");
} //封装内部监听事件
function init(){
//连接发生错误的回调方法
webSocket.onerror = function(event) {
console.log("webSocket连接发生错误.");
}; //连接成功建立的回调方法
webSocket.onopen = function(event) {
console.log("webSocket连接成功.");
//心跳检测重置
heartCheck.start();
}; //接收到消息的回调方法
webSocket.onmessage = function(event) {
//拿到任何消息都说明当前连接是正常的
if(event.data=="&"){
console.log("收到心跳回复"+event.data);
}else{
console.log("接收到消息="+event.data);
onMessage(event);
}
heartCheck.start();
}; //连接关闭的回调方法
// 断线重连
webSocket.onclose = function() {
console.log("webSocket连接断开");
} //监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。
window.onbeforeunload = function() {
webSocket.close();
console.log("窗口关闭,webSocket断开连接.");
} } function onMessage(event) {
setMessageInnerHTML(event.data);
} function postToServer() {
webSocket.send(document.getElementById("msg").value);
console.log("向服务器发送消息="+document.getElementById("msg").value);
document.getElementById("msg").value = "";
} //将消息显示在网页上
function setMessageInnerHTML(innerHTML) {
document.getElementById('message').innerHTML += innerHTML + '<br/>';
} function onClose(){
webSocket.close();
}
}); //心跳检测
var heartCheck = {
timeout: 10000,
timeoutObj: null,
serverTimeoutObj: null,
start: function(){
console.log("start heartCheck");
var self = this;
this.timeoutObj && clearTimeout(this.timeoutObj);
this.serverTimeoutObj && clearTimeout(this.serverTimeoutObj);
this.timeoutObj = setTimeout(function(){
//这里发送一个心跳,后端收到后,返回一个心跳消息,
console.log('发送心跳&');
webSocket.send("&");
self.serverTimeoutObj = setTimeout(function() {
console.log(webSocket);
console.log("服务器心跳回复超时");
webSocket.close();
}, self.timeout); }, this.timeout)
}
} </script> <body> <textarea id="message" readonly></textarea> <br />
<input id="msg" type="text" />
<button type="submit" id="sendButton" onClick="postToServer()">Send!</button>
<button type="submit" id="sendButton" onClick="onClose()">End</button> <script type="text/javascript" src="../js/webSocket.js"></script>
</body>
</html>

三、服务器端如何使用WebSocket

1. pom.xml文件引入对应的依赖包:

       <!-- webSocket 开始-->
<dependency>
<groupId>javax.websocket</groupId>
<artifactId>javax.websocket-api</artifactId>
<version>1.1</version>
<scope>provided</scope>
</dependency> <dependency>
<groupId>javax</groupId>
<artifactId>javaee-api</artifactId>
<version>7.0</version>
<scope>provided</scope>
</dependency>
<!-- webSocket 结束-->

2. spring配置文件配置websocket服务类

    <!-- websocket -->
<bean id="webSocketService" class="minyuantec.tvwall.service.impl.WebSocketServiceImpl" scope="singleton">
</bean>

3. struts2配置文件过滤websocket请求

<!-- 过滤掉ws请求 -->
<constant name="struts.action.excludePattern" value="/ws/.*,ws://.*"></constant>

4. 定义Websocket.java类

@ServerEndpoint("/ws/websocket")
public class WebSocket {
private static Logger logger = Logger.getLogger(WebSocket.class);
@SuppressWarnings("static-access")
private MessageHandler messageHandler = getWebSocketService().messageHandler; //静态变量,用来记录当前在线连接数。应该把它设计成线程安全的
public static int onlineCount = 0; //与某个客户端的连接会话,需要通过它来给客户端发送数据
public Session session; /**
* 连接建立成功调用的方法
* @param session 可选的参数。session为与某个客户端的连接会话,需要通过它来给客户端发送数据
*/
@OnOpen
public void onOpen(Session session){
this.session = session;
WebSocketMapUtil.put(session.getId(),this);//存入map
addOnlineCount(); //在线数加1
messageHandler.onConnect(session.getId());
System.out.println("有新连接加入!当前在线人数为" + getOnlineCount());
logger.info("有新连接加入!当前在线人数为" + getOnlineCount());
} /**
* 连接关闭调用的方法
*/
@OnClose
public void onClose(){
WebSocketMapUtil.remove(session.getId()); //从map中删除
subOnlineCount(); //在线数减1
messageHandler.onDisconnect(session.getId());
try {
if(session != null){
session.close();
}
} catch (IOException e) {
e.printStackTrace();
}
System.out.println("有一连接关闭!当前在线人数为" + getOnlineCount());
logger.info("有一连接关闭!当前在线人数为" + getOnlineCount());
} /**
* 收到客户端消息后调用的方法
* @param message 客户端发送过来的消息
* @param session 可选的参数
*/
@OnMessage
public String onMessage(String message, Session session) {
System.out.println("来自客户端的消息:" + message);
logger.info("来自客户端的消息:" + message);
if (message.equals("&")){
return "&";
}else{
messageHandler.onMessage(session.getId(),message);
return "Got your message ("+ message +")";
}
} /**
* 发生错误时调用
* @param session
* @param error
*/
@OnError
public void onError(Session session, Throwable error){
System.out.println("发生错误");
logger.info("发生错误:" + error);
error.printStackTrace();
} //单发消息
public void sendMessage(String message) throws IOException{
//阻塞式(同步)
//this.session.getBasicRemote().sendText(message);
//非阻塞式(异步)
this.session.getAsyncRemote().sendText(message);
} //群发消息
public void sendMessageAll(String message) throws IOException{
for(WebSocket webSocket : WebSocketMapUtil.getValues()){
webSocket.sendMessage(message);
}
} public static synchronized int getOnlineCount() {
return onlineCount;
} public static synchronized void addOnlineCount() {
WebSocket.onlineCount++;
} public static synchronized void subOnlineCount() {
WebSocket.onlineCount--;
} public WebSocketServiceImpl getWebSocketService(){
ClassPathXmlApplicationContext classPathXmlApplicationContext = new ClassPathXmlApplicationContext("classpath*:applicationContext.xml");
return (WebSocketServiceImpl) classPathXmlApplicationContext.getBean("webSocketService");
}
}

5. 在WebSocketServiceImpl实现类里实现服务器推送消息的方法

@Override
public boolean sendMessage(String message) {
logger.info("发送给客户端的websocket消息message=="+message);
if (messageHandler == null) {
logger.info("上层调用者没有给messageHandler赋值,websocket消息无法发送到客户端");
return false;
}
if (message == null || "".equals(message)) {
logger.info("发送给客户端的消息message为空");
return false;
}
try {
for(WebSocket webSocket : WebSocketMapUtil.getValues()){
webSocket.sendMessage(message);
logger.info("给sessionId为" + webSocket.session.getId() + "的客户端发送消息:"+message+"=成功");
}
return true;
} catch (IOException e) {
logger.info("向所有客户端发送消息:"+message+"=失败:" + e);
e.printStackTrace();
}
return false;
}

其实,使用Tomcat8开发WebSocket服务端非常简单,主要有如下两种方式:

1. 使用注解方式开发(上述示例代码),被@ServerEndpoint修饰的Java类即可作为WebSocket服务端。

2. 继承Endpint基类实现WebSocket服务端。

如需转载,请注明作者(冰湖一角)和链接https://www.cnblogs.com/bingyimeiling/p/10276801.html

欢迎关注微信公众号【Java典籍】,收看更多Java技术干货!

 ▼微信扫一扫下图↓↓↓二维码关注

 

WebSocket整合SSM(Spring,Struts2,Maven)的更多相关文章

  1. JAVAEE——SSH三大框架整合(spring+struts2+hibernate)

    一.整合原理 二.导包(41个) 1.hibernate (1)hibernate/lib/required (2)hibernate/lib/jpa | java persist api java的 ...

  2. 手把手教你整合 SpringMvc+Spring+MyBatis+Maven

    注:该教程是参考孙宇老师的<SpringMvc+Spring+Mybatis+Maven整合视频教程1>整理的,花了我六个多小时,边复习视频边调代码边写教程,保证该教程每一步都能正确执行, ...

  3. 手动配置三大框架整合:Spring+Struts2+mybatis

    如今主流的项目框架中,数据库持久层有可能不是hibernate,而是mybatis或者ibatis,事实上它们都是一样的,以下我来把环境搭建一下: [导入相关jar包]新建web项目projectms ...

  4. ssh整合(spring + struts2 + hibernate)xml版

    1.1分层 1.2jar节点 <dependencies> <dependency> <groupId>junit</groupId> <arti ...

  5. 使用SpringBoot整合ssm项目

    SpringBoot是什么? Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的初始搭建以及开发过程. Spring Boot 现在已经成为Java ...

  6. 手把手整合SSM框架

    前言 如果看过前几篇文章,对 Spring 和 MyBatis 有了一定了解,一定想上手试试.这篇文章从 0 到 1,手把手整合 SSM (Spring.Spring MVC.MyBatis). 本篇 ...

  7. spring+websocket整合

    java-websocket的搭建非常之容易,没用框架的童鞋可以在这里下载撸主亲自调教好的java-websocket程序: Apach Tomcat 8.0.3+MyEclipse+maven+JD ...

  8. IDEA+Maven 整合SSM框架实现简单的增删改查(新手入门,傻瓜操作)

    原博客地址:https://blog.csdn.net/khxu666/article/details/79851070 选用SSM框架的原因在目前的企业级Java应用中,Spring框架是必须的.S ...

  9. SSM Spring+SpringMVC+mybatis+maven+mysql环境搭建

    SSM Spring+SpringMVC+mybatis+maven环境搭建 1.首先右键点击项目区空白处,选择new->other..在弹出框中输入maven,选择Maven Project. ...

随机推荐

  1. spring-security doc logout

    18.5.3 Logging Out Adding CSRF will update the LogoutFilter to only use HTTP POST. This ensures that ...

  2. 优雅地实现CSS Animation delay心得

    话不多说直接开讲: 1.需求: 等待元素A的动画加载完,再加载B元素的动画(下图中A为大熊猫,B为下方卡片) 先来看下最后的效果啦: 2.初始思路: 在B元素的动画属性上加上delay(延迟,使得这个 ...

  3. 你不知道的JavaScript--Item6 var预解析与函数声明提升(hoist )

    1.var 变量预编译 JavaScript 的语法和 C .Java.C# 类似,统称为 C 类语法.有过 C 或 Java 编程经验的同学应该对"先声明.后使用"的规则很熟悉, ...

  4. QM

    答案: C 解题: 1. PV = 1,2 / 11% = 10.91 NPV = PV(inflow)-PV(outflow) = 10.91 - 8 = 2.91 2. IRR : NPV = 0 ...

  5. BZOJ_1803_Spoj1487 Query on a tree III_主席树+dfs序

    BZOJ_1803_Spoj1487 Query on a tree III_主席树 Description You are given a node-labeled rooted tree with ...

  6. BZOJ_4176_Lucas的数论_杜教筛+莫比乌斯反演

    BZOJ_4176_Lucas的数论_杜教筛+莫比乌斯反演 Description 去年的Lucas非常喜欢数论题,但是一年以后的Lucas却不那么喜欢了. 在整理以前的试题时,发现了这样一道题目“求 ...

  7. 【爆料】-《南澳大学毕业证书》UniSA一模一样原件

    ☞南澳大学毕业证书[微/Q:2544033233◆WeChat:CC6669834]UC毕业证书/联系人Alice[查看点击百度快照查看][留信网学历认证&博士&硕士&海归&a ...

  8. show()封装没有想象中那么简单

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. Java开源生鲜电商平台-通知模块设计与架构(源码可下载)

    Java开源生鲜电商平台-通知模块设计与架构(源码可下载) 说明:对于一个生鲜的B2B平台而言,通知对于我们实际的运营而言来讲分为三种方式:           1. 消息推送:(采用极光推送)   ...

  10. hystrix 请求合并(6)

    hystrix支持N个请求自动合并为一个请求,这个功能在有网络交互的场景下尤其有用,比如每个请求都要网络访问远程资源,如果把请求合并为一个,将使多次网络交互变成一次,极大节省开销.重要一点,两个请求能 ...