基于Pushlet实现的Web版报价系统

浏览数：74 / 时间：2015年06月09日

   项目的原因需要实现基于Web版的网上报价查询系统。用户需求很简单就是客户通过登录网站后，可以对产品提交买卖价格，系统有个集中展示屏幕来展示10档最优买入和卖出价格。对于上述功能的实现无外乎有两种实现方式：

推送（Push）技术：

一种建立在服务器上的机制，由服务器主动将信息发往客户端的技术。Push技术的优势在于信息主动性和及时性。

拉（Pull）技术：

客户机主动请求信息，采用客户端定时刷新页面，可使用Ajax技术实现，每隔N秒自动Reload一次，如果在此期间Server端数据发生变化，客户端可以获取新的内容。

   根据我们的需求，采用推送技术来实现上述功能是个比较好的选择。经过技术选型，最终选择使用Pushlet框架。Pushlet采用观察者模式，客户端订阅服务器感兴趣的事件，服务器端为每个客户端分配一个Session ID为标记，事件源会把新产生俄事件以多播的方式发送到订阅者的事件队列里。具体原理这里不作过多介绍，本文主要介绍一下使用Pushlet实现的一个计算报价平均值的Demo。

新建一个QuoteServlet.类，一个Servlet用于实现从客户端提交用户的报价，并触发服务器端发送价格变动事件。

package com;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


/*
 * Servlet方法实现数据的提交
 */
public class QuoteServlet extends HttpServlet{
	
	private static final long serialVersionUID = 2386052823761867369L;
	public static Double ttPrice = 0.00;
	
	
	public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException{

		// 调用 HttpServlet 自带的日志函数输出信息到控制台
		this.log("执行 doGet 方法... ");
		// 处理 doPost
		this.execute(request, response);
		
		//调用pushlet更新对方的数据
		String valueString = Double.toString(ttPrice);
		QuotePushlet.sendByMulticast(valueString);
		
	}
	
	/**
	 * 以 POST 方式访问页面时执行该函数。
	 */ 
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		this.log("执行 doPost 方法... ");
		
		// 处理 doPost
		this.execute(request, response);
		
		//调用pushlet更新对方的数据
		String valueString = Double.toString(ttPrice);
		//定向广播
		//QuotePushlet.sendByMulticast(valueString);
		//定向发送
		QuotePushlet.sendByUnicast(valueString);
		//QuotePushlet.sendByBroadcast(valueString);
	}
	
	private void execute(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException{
		
		String priceString = getReqStr(request.getParameter("qprice"),true);
		Double priceDb = 0.0;
		
		if (priceString != null && priceString != ""){
			priceDb = Double.valueOf(priceString);
		}  
		
		if (ttPrice != 0.00){
			ttPrice = ttPrice + priceDb;
			ttPrice = ttPrice/2;
		}else{
			ttPrice = priceDb;
		}

	}
	
    private  String getReqStr(Object s,boolean isGetMethod){
    	if(s==null) return "";
    	if(!isGetMethod) return ((String)s).toString();
    	try{    	   
    	   return new String(((String)s).toString().getBytes("ISO8859_1"), "GBK");
    	}catch(Exception e){
    	   return "";
    	}
    }

}

创建QuotePushlet类，用于实现事件广播。我这边分别使用了Pushlet的unicast,multicast,broadcast来发送广播事件。其中unicast是定向发，multicast,broadcast都是全局广播。

package com;

import java.util.HashMap;
import java.util.Map;

import nl.justobjects.pushlet.core.Dispatcher;
import nl.justobjects.pushlet.core.Event;
import nl.justobjects.pushlet.core.Session;
import nl.justobjects.pushlet.core.SessionManager;

/*
 * 使用push的broadcast,multicast,unicast方法
 * 
 * 实现数据的展示
 */
public class QuotePushlet {
	
	
	public static void sendByMulticast(String value){
		
		Map<String, String> map = new HashMap<String, String>();
		map.put("avgPrice", value);
		Event event = null;
		event = Event.createDataEvent("/quote/newPrice", map);
		
		//群发广播
		Dispatcher.getInstance().multicast(event);
	}
	
	
	public static void sendByUnicast(String value){
		
		Map<String, String> map = new HashMap<String, String>();
		map.put("avgPrice", value);
		Event event = null;
		event = Event.createDataEvent("/quote/newPrice", map);
		
		Session[] sessions = SessionManager.getInstance().getSessions();
		for ( Session session : sessions ) {
			//定向发送
			Dispatcher.getInstance().unicast(event, session.getId());
		}

	}
	
	public static void sendByBroadcast(String value){
		
		Map<String, String> map = new HashMap<String, String>();
		map.put("avgPrice", value);
		Event event = null;
		event = Event.createDataEvent("/quote/newPrice", map);
		
		Dispatcher.getInstance().broadcast(event);
	}
	

}
使用pushlet需要在Web.xml里进行配置。

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
	http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
	<!-- Define the pushlet servlet -->
	<servlet>
		<servlet-name>pushlet</servlet-name>
		<servlet-class>nl.justobjects.pushlet.servlet.Pushlet</servlet-class>
		<load-on-startup>3</load-on-startup>
	</servlet>
	<!-- Define the Servlet Mappings. -->
	<!-- The pushlet -->
	<servlet-mapping>
		<servlet-name>pushlet</servlet-name>
		<url-pattern>/pushlet.srv</url-pattern>
	</servlet-mapping>


	<servlet>
		<servlet-name>quoteServlet</servlet-name>
		<servlet-class>
			com.QuoteServlet
		</servlet-class>
	</servlet>
	<servlet-mapping>
		<servlet-name>quoteServlet</servlet-name>
		<url-pattern>/quoteServlet</url-pattern>
	</servlet-mapping>
</web-app>

另外还需要pushlet.properties和sources.properties,这里不表啦。

报价的JSP页面代码如下：

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>quote</title>

   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   <meta http-equiv="Pragma" content="no-cache">
   <script type="text/javascript" src="ajax-pushlet-client.js"></script>	
   <link rel="stylesheet" type="text/css" href="./script/easyui/jquery-easyui-1.3.5/easyui.css" >
<link rel="stylesheet" type="text/css" href="./script/easyui/jquery-easyui-1.3.5/icon.css" >
	<script type="text/javascript" src="./script/easyui/jquery.min.js"></script>
	<script type="text/javascript" src="./script/easyui/jquery.easyui.min.js"></script>
   	<style type="text/css" ID="PageStyle"> 
		body, td
		{
		     background: #ffffff;
		     color: #000000;
		     font-size: 14px;
		     font-family : verdana, sans-serif;
		} 
		body {
		    margin-left: 8px;
		    margin-right: 0px;
		} 
		.head {
		    color: #111111;
		}
	</style>
		
	<script type="text/javascript">
		 
		function QuotationPost(){
			  $.ajax({ 
				type: "post", 
				 url: "quoteServlet",
				 dataType: "text",
				 data:{qprice:$("#formqprice").val()},
				 success: function (data) { 
				 	  
				 }, 
				 error: function (XMLHttpRequest, textStatus, errorThrown) { 
				    alert(errorThrown); 
				 }
	         });
		}
	</script>
</head>
<body>

<div>
<span>当前债券的平均价格是</span>
  <span id="qprice"></span> 
  <br>
</div>

<div>
  <span>我要报价:</span>
  <div style="font-size: 20px;" >
	   <form id="QuotationForm" method="post"  >
		    <table>
			  <tr>
				 <td colspan="3" >  
				             报价：     <input name="qprice" id="formqprice"     type="text"    style="width:100px"  />
				 </td>
			  </tr>
			  <tr>
			  	 <td colspan="2" >
			  	    <input type="button" value="提交报价" onclick="QuotationPost();" />
			  	 </td>
			  </tr>
			</table>
	   </form>
  </div>
</div>

</body>
</html>

价格展示的前台页面如下：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="Pragma" content="no-cache" />
		<script type="text/javascript" src="ajax-pushlet-client.js"></script>		
		<script type="text/javascript">
			PL._init(); 
			PL.joinListen('/cuige/he');
			function onData(event) { 
				//alert(event.get("mmdata")); 
				// 离开
				// PL.leave();
				var kbDom = document.getElementById('kb');
				var kb = event.get("mess");
				//alert(event.get("mmdata"));
				kbDom.innerHTML = kb;
			}
		</script>
	</head>
	<body>
		当前债券平均价格：<span id="kb">...</span>元
	</body>
</html>



 

 

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： class style 代码 com 使用 src java log html class style 代码 com 使用 src java log html

相关文章

随机文章

您可能还喜欢

您可能还喜欢