Websocket通信

最新推荐文章于 2024-07-31 00:31:27 发布

老马识途__

最新推荐文章于 2024-07-31 00:31:27 发布

阅读量625

点赞数 1

分类专栏： js 文章标签： js

本文链接：https://blog.csdn.net/langyou0/article/details/103592059

版权

js 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

Websocket + stomp ssm整合非springboot

WebSocket是一种与HTTP不同的协议。两者都位于OSI模型的应用层，并且都依赖于传输层的TCP协议。虽然它们不同，但RFC 6455规定：“WebSocket设计为通过80和443端口工作，以及支持HTTP代理和中介”，从而使其与HTTP协议兼容。为了实现兼容性，WebSocket握手使用HTTP Upgrade头[1]从HTTP协议更改为WebSocket协议。
WebSocket协议支持Web浏览器（或其他客户端应用程序）与Web服务器之间的交互，具有较低的开销，便于实现客户端与服务器的实时数据传输。服务器可以通过标准化的方式来实现，而无需客户端首先请求内容，并允许消息在保持连接打开的同时来回传递。通过这种方式，可以在客户端和服务器之间进行双向持续对话。通信通过TCP端口80或443完成，这在防火墙阻止非Web网络连接的环境下是有益的。另外，Comet之类的技术以非标准化的方式实现了类似的双向通信。
大多数浏览器都支持该协议，包括Google Chrome、Firefox、Safari、Microsoft Edge、Internet Explorer和Opera。
与HTTP不同，WebSocket提供全双工通信。[2][3]此外，WebSocket还可以在TCP之上启用消息流。TCP单独处理字节流，没有固有的消息概念。在WebSocket之前，使用Comet可以实现全双工通信。但是Comet存在TCP握手和HTTP头的开销，因此对于小消息来说效率很低。WebSocket协议旨在解决这些问题。
WebSocket协议规范将ws（WebSocket）和wss（WebSocket Secure）定义为两个新的统一资源标识符（URI）方案[4]，分别对应明文和加密连接。除了方案名称和片段ID（不支持#）之外，其余的URI组件都被定义为此URI的通用语法。[5]
使用浏览器开发人员工具，开发人员可以检查WebSocket握手以及WebSocket框架。

起因

写一个小项目准备练手，找到了一个医院门诊系统，那就开搞，这个时候有一个小问题触及到了我的知识盲区，那就是即时通信。经过面向百度编程发现，有两种解决办法，一种是Ajax轮询，一种是websocket通信。

Ajax轮询
轮询是指客户端定时向服务器发送ajax请求，服务器接到请求后马上返回响应信息并关闭连接。
上代码

<head>
    <title>haorooms轮询案例</title>
    <script src="js/jquery.js"></script>
</head>
<body>
<script type="text/javascript">
        var getting = {
        url:'server.action',
        dataType:'json',
        	success:function(res) {
         		console.log(res);
			}
		};
	//Ajax定时访问服务端，不断获取数据 ，这里是1秒请求一次。
	window.setInterval(function(){$.ajax(getting)},1000);
	</script>
</body>
</html>

也就是说这个方式其实就是写一个定时器，每隔一段时间和后端服务器来一个连接拿到回应后就关闭。
前一次请求完成后，无论有无结果返回，一秒之后下一次请求又会发出。这就叫做Ajax轮询。这样存在性能问题，服务器也增加很多压力。但是这就是轮询的一种实现方式了。

长轮询

客户端向服务器发送Ajax请求，服务器接到请求后停住住连接，直到有新消息才返回响应信息并关闭连接，客户端处理完响应信息后再向服务器发送新的请求。长轮询本身不是一种真正的推送技术，而只是传统轮询技术的一个变种。然而，其能够在真正推送技术无法实现时模拟推送机制。

看示例

html>
<head>
    <title>haorooms长轮询案例</title>
    <script src="js/jquery.js"></script>
</head>
<body>
<script type="text/javascript">
    //前端Ajax持续调用服务端，称为Ajax轮询技术
    var get = {
        url:'server.action',
        dataType:'json',
        success:function(res) {
         console.log(res);
         $.ajax(get); //关键在这里，回调函数内再次请求Ajax
}        
        //当请求时间过长（默认为60秒），就再次调用ajax长轮询
        error:function(res){
        $.ajax($get);
  【；/*-
    }
};
$.ajax(get);
</script>
</body>
</html>

websocket
WebSocket 是独立的、创建在 TCP 上的协议。
我们一直使用的http协议只能由客户端发起，服务端无法直接进行推送，这就导致了如果服务端有持续的变化客户端想要获知就比较麻烦。WebSocket协议就是为了解决这个问题应运而生。
WebSocket协议，客户端和服务端都可以主动的推送消息，可以是文本也可以是二进制数据。而且没有同源策略的限制，不存在跨域问题。协议的标识符就是ws。像https一样如果加密的话就是wxs
来看一个简单的例子

let ws = new WebSocket("ws://localhost:8181");
ws.onopen = function() {
  console.log("client：打开连接");
  ws.send("client：hello，服务端");
};
ws.onmessage = function(e) {
  console.log("client：接收到服务端的消息 " + e.data);
  setTimeout(() => {
    ws.close();
  }, 5000);
};
ws.onclose = function(params) {
  console.log("client：关闭连接");
};

这就是一个简单的例子

<!--   项目要依赖的jar包-->
<dependency>
   <groupId>javax.websocket</groupId>
   <artifactId>javax.websocket-api</artifactId>
   <version>1.1</version>
   <scope>provided</scope>
</dependency>

编写后台代码

后台实现websocket有两种方式：使用继承类、使用注解；注解方式比较方便，一下代码中使用注解方式来进行演示。

声明websocket地址类似Spring MVC中的@controller注解类似，websocket使用@ServerEndpoint来进行声明接口：@ServerEndpoint(value="/websocket/{paraName}") ; 其中 “ { } ”用来表示带参数的连接，如果需要获取{}中的参数在参数列表中增加：@PathParam(“paraName”) Integer userId 。则连接地址形如：ws://localhost:8080/project-name/websocket/8，其中每个连接可以设置不同的paraName的值。

注解、成员数据介绍：

1.@OnOpen
public void onOpen(Session session) throws IOException{ } -------有连接时的触发函数。我们可以在用户连接时记录用户的连接带的参数，只需在参数列表中增加参数：@PathParam(“paraName”) String paraName。

2.@OnClose
public void onClose(){ } ------连接关闭时的调用方法。

3.@OnMessage
public void onMessage(String message, Session session) { } -------收到消息时调用的函数，其中Session是每个websocket特有的数据成员，详情见4.

4.Session ----每个Session代表了两个web socket断点的会话；当websocket握手成功后，websocket就会提供一个打开的Session，可以通过这个Session来对另一个端点发送数据；如果Session关闭后发送数据将会报错。

5.Session.getBasicRemote().sendText(“message”) -------向该Session连接的用户发送字符串数据。

6.@OnError
public void onError(Session session, Throwable error) { } --------发生意外错误时调用的函数。
dome：

import java.io.IOException;
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 org.slf4j.Logger;
import org.slf4j.LoggerFactory;
/** 
 * @Class: Test
 * @Description: websocket demo
 * @author 老马
 */
@ServerEndpoint(value="/websocketTest/{userId}")
public class Test {
    private Logger logger = LoggerFactory.getLogger(Test.class);
    
    private static String userId;
    
    //连接时执行
    @OnOpen
    public void onOpen(@PathParam("userId") String userId,Session session) throws IOException{
        this.userId = userId;
        logger.debug("新连接：{}",userId);
    }
    
    //关闭时执行
    @OnClose
    public void onClose(){
        logger.debug("连接：{} 关闭",this.userId);
    }
    
    //收到消息时执行
    @OnMessage
    public void onMessage(String message, Session session) throws IOException {
        logger.debug("收到用户{}的消息{}",this.userId,message);
        session.getBasicRemote().sendText("收到 "+this.userId+" 的消息 "); //回复用户
    }
    
    //连接错误时执行
    @OnError
    public void onError(Session session, Throwable error){
        logger.debug("用户id为：{}的连接发送错误",this.userId);
        error.printStackTrace();
    }

}