`

js取服务器端时间,并提供动态下载链接

阅读更多

最近项目中有这样一个需求:

页面动态刷新获取数据库中符合条件的数据的下载链接状态:如果已有可下载链接,就显示链接供用户下载,并显示服务器端当前时间;没有就继续动态获取。

 

 

实现功能:

js取服务器端时间,并动态检索下载链接,显示到页面供用户下载。

 

<script language="javascript">
var xmlhttp = null;
var interval = null;
var timeTimeout = null;
var statusValue = "";
var rtnData = new Array();
var btype;
var divContent = "";


/**
* 时间对象的格式化;
*/
Date.prototype.format = function(format){
 /*
  * eg:format="yyyy-MM-dd hh:mm:ss";
  */
 var o = {
  "M+" :  this.getMonth()+1,  //month
  "d+" :  this.getDate(),     //day
  "h+" :  this.getHours(),    //hour
  "m+" :  this.getMinutes(),  //minute
  "s+" :  this.getSeconds(), //second
  "q+" :  Math.floor((this.getMonth()+3)/3),  //quarter
  "S"  :  this.getMilliseconds() //millisecond
 }
  
 if(/(y+)/.test(format)) {
 	format = format.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
 }
 
   for(var k in o) {
    if(new RegExp("("+ k +")").test(format)) {
      format = format.replace(RegExp.$1, RegExp.$1.length==1 ? o[k] : ("00"+ o[k]).substr((""+ o[k]).length));
    }
   }
 return format;
}


function getFile(downUrl){
	//alert('** downUrl = <%=path%>/jsp/DataRequest/downloadFile.jsp?downUrl='+ downUrl);
	window.open("<%=path%>/jsp/DataRequest/downloadFile.jsp?downUrl="+ downUrl);
}


function getOs(){ 
	var OsObject = ""; 
	if(navigator.userAgent.indexOf("MSIE")>0) {
		return "MSIE"; //IE浏览器
	} 
	if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){ 
		return "Firefox"; //Firefox浏览器
	} 
	if(isSafari=navigator.userAgent.indexOf("Safari")>0) { 
		return "Safari"; //Safan浏览器
	} 
	if(isCamino=navigator.userAgent.indexOf("Camino")>0){ 
		return "Camino"; //Camino浏览器
	} 
	if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0){ 
		return "Gecko"; //Gecko浏览器
	}
}

//页面动态调用该函数,动态获取DB中下载链接
function loadXMLDoc(xmlName,dataTypeId){
   	var ivkUrl = "<%=path%>/jsp/DataRequest/autoFindRtnDataGTS.jsp?xmlName=" + xmlName + "&"+ Math.random();
	  //alert("** ivkUrl = "+ ivkUrl);
	  
	  if (window.XMLHttpRequest){
	  	xmlhttp=new XMLHttpRequest();
	  }else if (window.ActiveXObject){
	   	xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  }	  
	  
	   if (xmlhttp){
	   		xmlhttp.open("GET",ivkUrl,false);
	   		
	   		btype = getOs();
	   		if(btype != "Firefox"){
	   			xmlhttp.onreadystatechange = state_Change;
	    	}
	    	xmlhttp.send(null);
	    	
	   		if(btype == "Firefox"){
				 	updatePageGTS();
				}
	    
	   }else{
	   	alert("Your browser does not support XMLHTTP");
	   }
	   
	  interval = window.setTimeout("loadXMLDoc('<%=xmlName%>','<%=dataTypeId%>')", 10000);
	  //alert("** interval = "+ interval);
	  	
		//0: 等待;2:数据超大;3:无数据;99:数据获取成功
		if(statusValue < 0){
			window.clearTimeout(interval);
		}else if(statusValue == 2){
			window.clearTimeout(interval);
		}else if(statusValue == 3){
			window.clearTimeout(interval);
		}else if(statusValue == 99){
			window.clearTimeout(interval);
		}
 	}	
 	
 	
 	function state_Change(){
		var dataTypeId = "<%=dataTypeId%>";
						 		
		if (xmlhttp.readyState==4){
			if (xmlhttp.status==200){
				updatePageGTS();
			}else{
				//alert("Problem retrieving XML data");
			}
		}
	}
	
	//动态获取下载状态及下载链接地址
	function updatePageGTS(){
		//alert('updatePageGTS()');
		
		rtnData = eval(xmlhttp.responseText);//获取服务端返回数据(下载链接)
		if(rtnData[0]){
			statusValue = rtnData[0].reqStatus;
			
			if(statusValue < 0){
					document.getElementById("statusGTS").innerHTML = "<strong>Exception</strong>";
					
			}else if(statusValue == 0){
					document.getElementById("statusGTS").innerHTML = "<strong>Being processed</strong>";
								
			}else if(statusValue == 1){
					document.getElementById("statusGTS").innerHTML = "<strong>Begin zip</strong>";
					
			}else if(statusValue == 2){
					document.getElementById("statusGTS").innerHTML = "<strong>The data you requested is too large</strong>";
					
			}else if(statusValue == 3){
					document.getElementById("statusGTS").innerHTML = "<strong>There is no data</strong>";
										
			}else if(statusValue == 99){
					document.getElementById("statusGTS").innerHTML = "<strong>The request is processed successfully</strong>";
										
			}else if(statusValue == 100){
					document.getElementById("statusGTS").innerHTML = "<strong>Being Zipping</strong>";
			
			}else if(statusValue == -99){
					document.getElementById("reqStatus").innerHTML = "<strong>Being Zipping</strong>";
					//document.getElementById("reqStatus").innerHTML = "<strong>Zip Error</strong>";
			}
		}		
		
		for(i = 0; i < rtnData.length; i++){
			if(rtnData[i].downUrl){
				divContent += '<input id="downloadUrl'+ i +'" type="hidden" name="downloadUrl'+ i +'" value="'+ rtnData[i].downUrl +'" >';
				//alert("** divContent = "+ divContent);
			}			
		}
		
		document.getElementById("downUrlHidden").innerHTML = divContent;
		document.getElementById("downloadUrlSize").value = rtnData.length;
		//alert("** downUrlHidden = "+document.getElementById("downUrlHidden").innerHTML);
		//alert("** 下载文件数 = "+ rtnData.length);
		
		
		if(rtnData.length == 1 && rtnData[0].downUrl){//1个下载链接
			rtnData[0].downUrl = '\''+ rtnData[0].downUrl +'\'';
			
			//alert("下载链接: "+ rtnData[0].downUrl);
			document.getElementById("downloadUrlGTS").innerHTML = '<a href="#" onclick="getFile('+ rtnData[0].downUrl +')"><legend>Download results</legend></a>';			
		}
		
		if(rtnData.length > 1){//多个下载链接
			//alert("** 下载连接数:"+ rtnData.length);
			document.getElementById("downloadUrlGTS").innerHTML = '<a href="#" onclick="submitForm()"><legend>Download results</legend></a>';			
		}
	}
  
  	function submitForm(){
		document.mainform.action= "<%=path%>/jsp/DataRequest/downList.jsp";
		document.mainform.submit();
		return true;
	}
	
	//获取服务器端时间,计算和客户端时间差,并在客户端显示
	function showtime(){		
		var str = '<%=serverTime%>';
		var	arr = str.split(" ");
		var arr1 = arr[0].split("-");
		var	arr2 = arr[1].split(":");
		
		var cTime = new Date().format("yyyy-MM-dd hh:mm:ss");
		var	cArr = cTime.split(" ");
		var cArr1 = cArr[0].split("-");
		var	cArr2 = cArr[1].split(":");
		
		//alert('服务端时间:<%=serverTime%>');
		//alert('客户端时间:'+ cTime);
		
		var serverTimes = new Date(arr1[0], arr1[1], arr1[2], arr2[0], arr2[1], arr2[2]);
		var clientTimes = new Date(cArr1[0], cArr1[1], cArr1[2], cArr2[0], cArr2[1], cArr2[2]);
		//alert("** arr2[0]: "+ arr2[0] +"| arr2[1]: "+arr2[1] +"| arr2[2]: "+ arr2[2]);
		//alert("** cArr2[0]: "+ cArr2[0] +"| cArr2[1]: "+cArr2[1] +"| cArr2[2]: "+ cArr2[2]);	
		
		var diff = (clientTimes.valueOf() - serverTimes.valueOf());
		var diffMillions = parseInt(diff,10);
		//alert("时间差: "+ diffMillions);
		
		var currdate = new Date();
		currdate.setTime(currdate.getTime() - diffMillions);
		cTime = currdate.format("yyyy-MM-dd hh:mm:ss");
		
		
		//alert('time1 = ' + document.getElementById('time1'));
		document.getElementById('time1').innerHTML = cTime;
		
		//alert('time2 = ' + document.getElementById('time2'));
		document.getElementById('time2').innerHTML = cTime;
		
		timeTimeout = window.setTimeout("showtime();", 1000); //设定函数自动执行时间为 1000 ms(1 s)		
				
		if(statusValue == 2){
			window.clearTimeout(timeTimeout);
		}else if(statusValue == 3){
			window.clearTimeout(timeTimeout);
		}
		
		if(statusValue == 99 && divContent){//获取到下载链接
			window.clearTimeout(timeTimeout);
		}
	}
  
</script>


//触发动态刷新
<script language="javascript">showtime();</script>
<script language="javascript">loadXMLDoc('<%=xmlName%>','<%=dataTypeId%>');</script>

 

分享到:
评论

相关推荐

    jQuery手机端点击弹出选择取货时间代码

    "jQuery手机端点击弹出选择取货时间代码" 是一个专门针对手机移动端商城设计的功能模块,它旨在提供一种简洁且美观的方式来让用户选择取货的日期和时间。这个功能可以极大提升用户在进行在线购物时的交互体验,确保...

    免费友情链接网.rar

    2. **动态网页技术**:实现这个平台可能需要使用PHP、ASP.NET、Java JSP或Node.js等服务器端编程语言,这些语言可以处理用户请求,连接数据库,管理链接申请和展示链接列表。 3. **数据库管理**:为了存储和管理...

    javascript从数据库取数据.pdf

    JavaScript 从数据库获取数据是一种常见的做法,特别是在动态网站和Web应用程序中,用于提供实时更新的信息。在这个特定的例子中,我们看到一个使用JavaScript实现的首页图片轮播效果,这些图片的数据存储在SQL...

    JD_M端手动取ck.zip

    "node.dll"是Node.js运行时的一个动态链接库,Node.js是一种基于Chrome V8引擎的JavaScript运行环境,常用于构建服务器端和网络应用。它可能在这个过程中用于处理网络请求和解析Cookie。而"JD_手动取ck.exe"很可能是...

    javascript从数据库取数据参考.pdf

    代码通过`&lt;%= ... %&gt;`语法从服务器端的CS(可能是ASP.NET的C#或VB.NET)代码获取图片的属性数组,如`imgUrl`, `imgtext`, `imgLink`, 和 `imgAlt`,并使用`split(",")`方法将字符串分割成数组。 `changeimg`函数...

    javascript从数据库取数据汇编.pdf

    JavaScript 代码会通过服务器端的 ASP 或其他技术获取数据库中的图片信息,例如 `imgUrl`、`imgtext`、`imgLink` 和 `imgAlt`,然后使用 `split(",")` 方法将字符串拆分为数组。`changeimg` 函数用于定时切换图片,`...

    获取ASP.NET下载状态

    5. **使用Web API和客户端脚本**:结合JavaScript,可以创建自定义的解决方案,例如使用Web API接口让客户端报告其下载进度,服务器端存储这些信息。 在提供的文件列表中,`Handler1.ashx`可能是一个HTTP处理器,...

    javascript从数据库取数据借鉴.pdf

    值得注意的是,JavaScript代码直接写在HTML文件中而不是外部JS文件中,因为这里使用了服务器端语言(如ASP.NET)的特性,通过`&lt;%= %&gt;`标记从后台获取数据。 在JavaScript中,定义了几个数组来存储从数据库获取的...

    JS跑马灯.网站首页的图片左右滑动.连接数据库,从数据库中获得图片.JS跑马灯.RAR

    在这个场景下,JS(JavaScript)可能不是直接与数据库交互,而是可能通过服务器端的技术如ADO.NET(ActiveX Data Objects .NET),这是一种微软提供的数据访问接口,能够使.NET应用程序连接到各种数据库。...

    JavaScript完全自学宝典 源代码

    \ajaxmodel\src\bonze\CityServlet.java 动态加载列表框的服务器端。 \ajaxmodel\src\bonze\AutoRefServlet.java 自动刷新网页的服务器端。 \ajaxmodel\src\bonze\ProcessServlet.java 显示进度条的服务器端...

    javascript源代码

    JavaScript是一种广泛应用于Web开发的脚本语言,它主要在客户端运行,为用户提供动态交互体验。在给定的“javascript源代码”中,我们重点关注的是如何利用JavaScript获取客户端的相关信息,如IP地址、MAC地址以及...

    UniGUI集合说明--追月无名.pdf

    - **文件处理**:生成Excel文件并提供下载链接。 #### 20. UniDBGridExcel文件下载 实现`UniDBGridExcel`文件下载的过程包括: - **导出数据**:使用`UniDBGrid`的导出功能。 - **文件处理**:生成Excel文件。 - ...

    phpDesigner8的下载安装

    安装时间取决于计算机性能和网络速度。 6. **完成安装**:安装完成后,安装程序会提示是否立即启动phpDesigner8。根据个人需要选择即可。 #### 五、打开与使用 1. **首次启动**:首次启动phpDesigner8时,软件可能...

    UniGUI集合说明

    设置UniGUI的超时时间可以通过调整服务器端的配置来实现,以防止长时间未操作导致的会话过期。 #### 45. UniGUI如何实现登陆页面 实现UniGUI的登陆页面通常包括: - **设计界面**:设计登录表单的UI。 - **验证...

    UniGUI集合说明.doc

    事件中的代码可以在服务器端(Server-side)或客户端(Client-side)执行,具体取决于事件的性质。通常,涉及到界面更新和用户交互的代码在客户端执行,而业务逻辑和数据处理通常在服务器端进行。 2. **字体显示...

    客户端服务器

    Node.js允许开发者使用JavaScript进行服务器端编程,提供了丰富的模块生态系统,如Express.js用于构建web应用,MongoDB驱动程序用于数据库操作。这种同语言跨端的能力使得开发流程更为统一,降低了学习曲线。 ...

    倒计时转发

    这可以是一个内部页面,也可以是外部链接,具体取决于应用需求。 考虑到标签中提到了"jsp",这可能意味着后端部分使用了Java Server Pages技术。在实际项目中,可能需要通过JSP页面来设置初始的倒计时时间或者获取...

Global site tag (gtag.js) - Google Analytics