【反ajax】webSocket实现实时推送功能

Everyday都不同

浏览: 724940 次
性别:
来自: 宇宙

最近访客更多访客>>

gaoshaoye

hbzyb

loginboot

u012363178

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

Java EE

javaee7 html5 webSocket 反ajax 主动推送

额。前天就说有时间要研究下webSocket这种实时推技术。已经用Comet实现了一个结合redis发布/订阅功能的小功能，其实还是有点复杂度的。今天有时间，遂了解了下webSocket，发现也没有想象中那么难！

但我研究webSocket做东西还是饶了一大圈，有一种用spring+webSocket做的，略复杂（可能容错性和健壮性更高？），最后卡在404连接上了，用的jar包是spring-websocket-4.2.x.jar及相关依赖jar包。鉴于参考网上的例子并没实现，故作罢。

后来，用了JavaEE7 (jdk1.7+支持)和html5支持的webSocket，问题就显得简单多了。涉及jar包：websocket-api-1.x.jar

客户端：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>发布订阅测试</title>
	
	<script type="text/javascript">
		var socket = null;
		$(function() {
			var websocket;
//考虑各种浏览器兼容问题
            if ('WebSocket' in window) {
                websocket = new WebSocket("ws://localhost:8080/amp/socket/webSocketServer");
            } else if ('MozWebSocket' in window) {
                websocket = new MozWebSocket("ws://localhost:8080/amp/socket/webSocketServer");
            } else {
                websocket = new SockJS("http://localhost:8080/amp/sockjs/webSocketServer");
            }
//和服务端连接成功后的操作 send操作必须要有  服务端才会可能响应          
            websocket.onopen = function (evnt) {
            	var data = {appId:'hx', status:'s'};
            	websocket.send(JSON.stringify(data));//尝试给服务端发送json参数，这也是项目中常见的的
            	$("#showMsg").append("连接成功!<br/>");
            };
//接收到服务端返回的数据后回调
            websocket.onmessage = function (evnt) {
                $("#showMsg").append("(<font color='red'>"+evnt.data+"</font>)<br/>");
            };
//连接失败回调
            websocket.onerror = function (evnt) {
            };
//服务端关闭引发
            websocket.onclose = function (evnt) {
            	$("#showMsg").append("连接关闭!<br/>");
            }
		});
	</script>
</head>
<body>
	<div id="showMsg" style="border: 1px solid; width: 500px; height: 400px; overflow: auto;"></div>
</body>

服务端：

import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;

import net.sf.json.JSONObject;

@ServerEndpoint("/socket/webSocketServer")
public class ScrollInfoHandler {
//接收到客户端的请求
	@OnMessage
	  public void onMessage(String message, Session session)
	    throws IOException, InterruptedException {
	   
	    System.out.println("Received: " + message);
	    
	    Map<String, String> params = JSONObject.fromObject(message);
	    
	    // Send the first message to the client
	    session.getBasicRemote().sendText("return params after handled: " 
	    		+ params.get("appId").toUpperCase() + ", " + params.get("status").toUpperCase());
	   
	    // Send 3 messages to the client every 5 seconds
	    int sentMessages = 0;
//模拟推送数据
	    while(true){
	      Thread.sleep(2000);
	      session.getBasicRemote().
	        sendText("This is an intermediate server message. Count: "
	          + Math.random());
	    }
	   
	  }
//和客户端连接成功后	   
	  @OnOpen
	  public void onOpen() {
	    System.out.println("Client connected");
	  }
//客户端关闭后	 
	  @OnClose
	  public void onClose() {
	    System.out.println("Connection closed");
	  }
	
}

如果想和redis发布订阅结合起来，很简单：在服务端的onOpen函数里启动订阅渠道的线程，以及定时检查队列大小的线程，而在onMessage函数里执行定时从队列pop数据并send，在onClose里面写停止线程和情空队列的逻辑即可啦。

下面就来测一测效果！

启动项目，打开这个客户端页面，先观察控制台打印：

Client connected

Received: {"appId":"hx","status":"s"}

说明，服务端已经跟客户端连通，并且收到传递过来的参数了。

观察客户端页面，你会发现：（某一时刻）

客户端是不断刷新着的，而且也收到了服务端处理参数后传过来的数据了。

若关闭客户端，服务端控制台会打印：Connection closed

若关闭服务端，客户端会这样：

说明，达到了响应服务端关闭后的效果。

以上，只是一个很简单的推送实例。要具体应用到实际项目中是需要不断完善代码以提高其健壮性的。但至少对我而言，服务端主动推送技术终于不再那么神秘和困惑了，以后对实时性要求比较高的地方可以采纳，终于突破ajax的方式了。

查看图片附件

0
顶

0
踩

分享到：

【转】MySql索引类型的总结和使用 | 运用Comet技术实现服务端往客户端主动推送 ...

2016-01-21 18:28
浏览 9015
评论(1)
分类:行业应用
查看更多

1 楼 wahahachuang8 2017-09-27

GoEasy实时Web推送，支持后台推送和前台推送两种：后台推送可以选择Java SDK、 Restful API支持所有开发语言；前台推送：JS推送。无论选择哪种方式推送代码都十分简单（10分钟可搞定）。由于它支持websocket 和polling两种连接方式所以兼顾大多数主流浏览器，低版本的IE浏览器也是支持的。另外GoEasy针对前台推送采用OTP (one-time-password)方式加密方式，能有效杜绝他人通过在页面上获取 appkey的方式，进行非法操作,十分安全！GoEasy多机房部署，支持全球推送。个人觉得十分值得推荐： goeasy.io

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论