spring整合websocket+stomp(三)应用实例

迈不过友情╰ 2023-02-09 14:06 33阅读 0赞

1.一对一实时推送

/** * * @title showQRcode * @Description 显示二维码页面（嵌websocket） 被扫码 * @author chenlf * @return */
    	@RequestMapping(value = "showQRcode")
    	public String showQRcode(Enroll enroll,Model model, HttpServletRequest request){ 
    		Attachment attach = attachmentService.getByBsId(enroll.getId());//获取附件对象
    		String url = MeetingUtils.getSystemAccessPath(request) + Constant.WEBSOCKET_STOMP;
    		model.addAttribute("fileId", attach.getId());
    		model.addAttribute("addrUrl", url);
    		model.addAttribute("subUrl", Constant.URL_QUEUE_QRCODE);
    		return "modules/meeting/websocket/scanQRcode";
    	}
    	
    	/** * * @title doQRcode * @Description 扫码枪扫码 * @author chenlf * @return */
    	@RequestMapping(value = "doQRcode")
    	public String doQRcode(Enroll enroll,HttpServletRequest request, Model model){ 
    		String userId = enroll.getUserId();//被扫码对象的userId
    		String message = "签到成功！";//扫码成功信息
    		User user = systemService.getUser(userId);//获取报名的用户
    		if(!Constant.ENROLL_SIGN_IN_STATUS_NOSIGNIN.equals(enroll.getSignInStatus()) && enroll.getSignInStatus() != null){ 
    			message = "您已签到成功，无需重复签到！";
    		}else{ 
    			enroll.setSignInStatus(Constant.ENROLL_SIGN_IN_STATUS_SIGNEDIN);
    			enrollService.save(enroll);
    		}
    		//发送信息
    		template.convertAndSendToUser(userId, Constant.URL_QUEUE_QRCODE, message);
    		//handler.sendMessageToUser(userId, new TextMessage(message));
    		model.addAttribute("user", user);
    		return "modules/meeting/enroll/enrollUserForm";//返回被扫描个人用户信息 - 返回页面
    	}

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    <%@ include file="/WEB-INF/views/include/taglib.jsp"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>二维码扫描</title>
    <style type="text/css"> html, body { width: 100%; margin: 0; padding: 0; text-align: center; } img { top:0px; bottom:0px; left:0px; right:0; margin:auto; position: absolute; } #scanResult{ top:0px; bottom:0px; left:0px; right:0; margin:auto; position: absolute; } </style>
     <link href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
        <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
        <script src="https://cdn.bootcss.com/sockjs-client/1.1.4/sockjs.min.js"></script>
        <script src="https://cdn.bootcss.com/stomp.js/2.3.3/stomp.min.js"></script>
       
    </head>
    <body>
    <div id="scanResult">
    	<img style="display: inline; margin: auto;" src="${ctx}/meeting/attachment/officePreview?fileId=${fileId}">
    </div>
    <script type="text/javascript"> var stompClient = null; function connect() { var socket = new SockJS('${addrUrl}'); stompClient = Stomp.over(socket); stompClient.connect({ }, function (frame) { //setConnected(true); console.log('Connected: ' + frame); stompClient.subscribe('/user${subUrl}', function (respone) { //返回信息 showResult(respone.body); }); }); } function showResult(message) { $("#scanResult").html("<span>" + message + "</span>"); $("#conversation").show(); } $(function () { connect(); }); </script>
    </body>
    </html>

2.一对多实时推送

/** * * <p>Title: WebSocketController</p> * <p>Description: WebSocketController</p> * <p>Company: </p> * @author chenlf */
    @Controller
    @RequestMapping("/socket")
    public class WebSocketController { 
    
    	/** * * @title serverHtml * @Description 服务端 * @author chenlf * @param model * @param request * @return */
    	@RequestMapping("/test")
    	public String serverHtml(Model model, HttpServletRequest request) { 
    		String url = MeetingUtils.getSystemAccessPath(request) + Constant.WEBSOCKET_STOMP;
    		model.addAttribute("addrUrl", url);
    		model.addAttribute("subUrl", Constant.URL_PDF_SHARE);
    		return "modules/meeting/shareScreen/testServer";
    	}
    
    	/** * * @title clientHtml * @Description 客户端 * @author chenlf * @param model * @param request * @return */
    	@RequestMapping("/testclient")
    	public String clientHtml(Model model, HttpServletRequest request) { 
    		String url = MeetingUtils.getSystemAccessPath(request) + Constant.WEBSOCKET_STOMP;
    		model.addAttribute("addrUrl", url);
    		model.addAttribute("subUrl", Constant.URL_PDF_SHARE);
    		return "modules/meeting/shareScreen/testClient";
    	}
    }

/** * * <p>Title: ShareHtmlController</p> * <p>Description: websocket推送消息</p> * @author chenlf */
    @Controller
    public class ShareHtmlController { 
    	
    	 @Autowired
        SimpMessagingTemplate smt;
    
    	/** * * @title sendAllSub * @Description 对所有订阅者推送消息（广播） * @author chenlf * @param str 消息内容 * @throws MessagingException * @throws UnsupportedEncodingException */
        @MessageMapping("/send/pngpath")
        public void sendAllSub(String str) throws MessagingException, UnsupportedEncodingException{ 
            System.out.println("开始推送消息了：" + str);
            smt.convertAndSend(Constant.URL_PDF_SHARE, str);//发送订阅消息
        }
    }

服务端

//websocket相关
    var stompClient = null;
    
    function connect() { 
        var socket = new SockJS('${addrUrl}');
        stompClient = Stomp.over(socket);
        stompClient.connect({ }, function (frame) { 
    
        });
    }
    
    
    function test(){ 
    	var test = "123457";
              stompClient.send("/app/send/pngpath",{ }, test);
    }
    
    $(function () { 
    	connect();
    	
    });
    //每秒执行一次
    //setInterval("test()","1000");

客户端接收