利用Jquery实现http长连接(LongPoll) {转}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryAjaxLongPoll.aspx.cs" Inherits="JqueryAjaxLongPoll" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script type="text/javascript" src="script/jquery-1.2.6.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#Button1").bind("click",{btn:$("#Button1")},function(evdata){
$.ajax({
type:"POST",
url:"JqueryAjaxLongPoll.aspx",
dataType:"json",
timeout:10000,
data:{ajax:"1",time:"10000"},
success:function(data,textStatus){
//alert("ok!");
evdata.data.btn.click();
},
complete:function(XMLHttpRequest,textStatus){
if(XMLHttpRequest.readyState=="4"){
alert(XMLHttpRequest.responseText);
}
},
error: function(XMLHttpRequest,textStatus,errorThrown){
//$("#ajaxMessage").text($(this).text()+" out!")
alert("error:"+textStatus);
if(textStatus=="timeout")
evdata.data.btn.click();
}
});
});
/*$("#ajaxMessage").ajaxStart(function(){
$(this).text("准备建立请求.readyState0:");
});
$("#ajaxMessage").ajaxSend(function(evt, request, settings){
$(this).text("开始请求,准备发送数据.readyState1:"+request.readyState);
});
$("#ajaxMessage").ajaxComplete(function(event,request, settings){
if(request.status==200)
$(this).text("请求完成.readyState4:"+request.readyState);
});
$("#ajaxMessage").ajaxStop(function(){
$(this).text("请求结束.");
});*/
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input id="Button1" type="button" value="AjaxLongPoll" />
<label id="ajaxMessage"></label>
</div>
</form>
</body>
</html>
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Threading;
public partial class JqueryAjaxLongPoll : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Request.Form["ajax"] == "1")
{
//Response.End();
int time = Convert.ToInt32(Request.Form["time"]);
DateTime date1 = DateTime.Now.AddMilliseconds((double)time);
bool ready = false;
while (Response.IsClientConnected)
{
Thread.Sleep(3000);
if (DateTime.Compare(date1, DateTime.Now) < 0)
{
Response.End();
break;
}
//ready = true;
if (ready)
{
Response.Write("SetValue('" + DateTime.Now.ToString() + "')");
//Response.Flush();
Response.End();
break;
}
else
{
}
}
}
else
{
if (!Page.IsPostBack)
{
}
}
}
}
思路:
利用jquery,很方便的就能实现ajax,上面设置了ajax的timeout时间,由于设置了timeout将会造成不能保持长连接,到了时间ajax自动会报“超时”的错误,也就是会调用error方法,此时textStatus=="timeout",timeout后重新进行ajax请求。服务器接受ajax请求的时候,会接收一个超时时间的值,超时的情况下服务器端的处理也立即停止。当客户端成功获取返回结果时,也会立即进行新的ajax请求,如此循环。
为什么要设置客户端的ajax超时值呢?因为服务器为了保持请求(阻塞请求),必须有一个无限循环,循环的结束条件就是获取到了返回结果,如果客户端关闭了(客户端浏览器的关闭不会发消息给服务器),服务器无法知道客户端已经关了,这个请求没必要处理下去了。最终会造成资源过度浪费,只要用一个折中的办法,限制超时时间。
可以不必设置客户端ajax的超时时间,但进行请求的时候传递一个超时值给服务器,服务器在处理的时候,如果超时时间到了的话,还没有客户端需要的结果,这时传递一个超时信息给客户端,客户端接收到了此信息,根据情况重新进行ajax请求。XMLHttpRequest没有超时的参数,Jquery用window.setTimeout自己封装的(到了定时时间运行超时处理方法,和XMLHttpRequest结束方法)。可以根据这个思路来改变一下,IBM上介绍的LONG POLL好像也是这样的。
$(document).ready(function(){
$("#Button1").bind("click",{btn:$("#Button1")},function(evdata){
$.ajax({
type:"POST",
url:"JqueryAjaxLongPoll.aspx",
dataType:"json",
data:{ajax:"1",time:"6000000"},
success:function(data,textStatus){
//成功
if(data.success=="1"){
//客户端处理
//...
///重新请求
evdata.data.btn.click();
}
//超时
if(data.success=="0"){
evdata.data.btn.click();
}
},
complete:function(XMLHttpRequest,textStatus){
if(XMLHttpRequest.readyState=="4"){
alert(XMLHttpRequest.responseText);
}
},
error: function(XMLHttpRequest,textStatus,errorThrown){
//$("#ajaxMessage").text($(this).text()+" out!")
// alert("error:"+textStatus);
// if(textStatus=="timeout")
evdata.data.btn.click();
}
});
});
后台代码变更后:
if (Request.Form["ajax"] == "1")
{
int time = Convert.ToInt32(Request.Form["time"]);
DateTime date1 = DateTime.Now.AddMilliseconds((double)time);
bool ready = false;
while (Response.IsClientConnected)
{
Thread.Sleep(3000);
if (DateTime.Compare(date1, DateTime.Now) < 0)
{
Response.Write("{success:'0'}");
Response.End();
break;
}
//此处进行请求处理,有结果了置ready = true
//ready = true;
if (ready)
{
Response.Write("{success:'1'}");
Response.End();
break;
}
}
}
else
{
if (!Page.IsPostBack)
{
}
}
上面的方法应该就可以满足要求了,具体的超时时间可以根据情况来设置。这也是我根据IBM上介绍的“server push”思路,来实现了其中的一种,也不知道有没有问题,还请大家多多赐教。
利用Jquery实现http长连接(LongPoll) {转}的更多相关文章
- 利用Jquery实现http长连接(LongPoll)
参考:http://www.cnblogs.com/vagerent/archive/2010/02/05/1664450.html PS:为了满足 某些需要 实时请求的业务(PS:例如聊天室),我们 ...
- PHP持续保有长连接,利用flush持续更新浏览器UI,下载进度条实现
如何用PHP+JS实现上传进度条,大部分的人可能都实现过,但是下载呢?如何呢?原理也是差不多的,就是分次读写,每次读多少字节,但是这样的不好就是长连接,一般实现下载进度条常用的两种解决方案是:一种是需 ...
- 利用node.js来实现长连接/聊天(通讯实例)
首先: 需要在服务器端安装node.js,然后安装express,socket.io这两个模块,并配置好相关的环境变量等. 其次: 服务端代码如下: var app = require('expres ...
- comet基于HTTP长连接技术(java即时通信,推送技术详解)
服务器推送技术的基础思想是将浏览器主动查询信息改为服务器主动发送信息,服务器发送一批数据,浏览器显示消息,同时保证与服务器的连接,当服务器需要再一次的发送数据,浏览器显示数据并保持连接. comet基 ...
- 转:基于ASP.NET的Comet长连接技术解析
原文来自于: Comet技术原理 来自维基百科:Comet是一种用于web的技术,能使服务器能实时地将更新的信息传送到客户端,而无须客户端发出请求,目前有两种实现方式,长轮询和iframe流. 简单的 ...
- SignalR代理对象异常:Uncaught TypeError: Cannot read property 'client' of undefined 推出的结论 SignalR 简单示例 通过三个DEMO学会SignalR的三种实现方式 SignalR推送框架两个项目永久连接通讯使用 SignalR 集线器简单实例2 用SignalR创建实时永久长连接异步网络应用程序
SignalR代理对象异常:Uncaught TypeError: Cannot read property 'client' of undefined 推出的结论 异常汇总:http://www ...
- HTTP的长连接和短连接——Node上的测试
本文主要从实践角度介绍长.短连接在TCP层面的表现,借助Node.JS搭建后台服务,使用WinHTTP.Ajax做客户端请求测试,最后简单涉及WebSocket. 关键字:长连接.短连 ...
- 网页实时聊天之js和jQuery实现ajax长轮询
众所周知,HTTP协议是无状态的,所以一次的请求都是一个单独的事件,和前后都没有联系.所以我们在解决网页实时聊天时就遇到一个问题,如何保证与服务器的长时间联系,从而源源不段地获取信息. 一直以来的方式 ...
- Comet:基于 HTTP 长连接的“服务器推”技术解析
原文链接:http://www.cnblogs.com/deepleo/p/Comet.html 一.背景介绍 传统web请求,是显式的向服务器发送http Request,拿到Response后显示 ...
随机推荐
- C# 验证IP是否正确简易方法 源代码
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- 从客户端检测到有潜在危险的Request.Form 值【转】
asp.net开发中,经常遇到“从客户端检测到有潜在危险的Request.Form 值”错误提示,很多人给出的解决方案是: 1.web.config文档<system.web>后面加入这一 ...
- 排序 选择排序&&堆排序
选择排序&&堆排序 1.选择排序: 介绍:选择排序(Selection sort)是一种简单直观的排序算法.它的工作原理如下.首先在未排序序列中找到最小(大)元素,存放到排序序列的起始 ...
- Helloworld模块之内核makefile详解
Hello World 模块以及对应的内核makefile详解 hello.c: #include <linux/module.h> //所有模块都需要的头文件 #include < ...
- Java使用FileLock实现Java进程互斥锁
原理:JDK的nio包中FileLock实现类似Linux fcntl的文件锁, 可使文件被进程互斥访问. 借助此功能, 可以实现强大的Java进程互斥锁, 从而在应用层面保证同一时间只有惟一的Ja ...
- 关于自定义的NavigationBar
系统的NavigationBar局限太大,而且现在我要做的navigationBar需要四个按钮,一个Label,一个ImageView,所以不能用系统默认的. 刚刚咨询了一个高手,她的建议是,将系统 ...
- 混合使用C和C++
C++作为C语言的扩展集,几乎所有的C程序都可以在C++中编译和运行,但是要注意C程序中可能使用了C++中的关键字作为变量,比如在C中:int class = 0; 但这在C++中不行.出于方便性,我 ...
- [转]ubuntu 10.04下的配置tftp服务器
[转]ubuntu 10.04下的配置tftp服务器 http://www.cnblogs.com/geneil/archive/2011/11/24/2261653.html 第1步:安装tftp所 ...
- Data Developer Center > Learn > Entity Framework > Get Started > Loading Related Entities
Data Developer Center > Learn > Entity Framework > Get Started > Loading Related Entitie ...
- Teamwork-Week2真对必应词典和有道词典的软件分析和用户需求调查(桌面版)
经调查,现在有道词典在该领域拥有很大程度的市场占有率,所以我们将有道词典与必应词典进行对比. 核心功能一:单词本 有道词典中的单词本都只能是由用户手动添加不会的单词,而必应词典中的单词 不仅可以被自己 ...