实现ASP.NET无刷新下载并提示下载完成的开发思路
先给大家贴代码了，后面给大家在做具体的文字说明。
以下是前端代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication1.WebForm2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="Scripts/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function () {
$("#btnDownLoad").on("click", function () {
var $loading = $("#loadingbox");
var downId = new Date().getTime() + "-" + Math.random();
$loading.css("display", "block");
DownLoad($("#downfile").val(), downId);
var tid=setInterval(function () {
$.post("WebForm2.aspx", { getresult: "Y", downid: downId }, function (result) {
//document.writeln("result:" + result);
if(result=="Y")
{
clearInterval(tid);
$loading.css("display", "none");
alert("下载完成！");
}
});
}, 3000);
});
function DownLoad(filename,downid) {
var $form = $("<form target='' method='post' action='WebForm2.aspx'></form>");
$form.append("<input type='hidden' name='filename' value='" + filename + "'>");
$form.append("<input type='hidden' name='downid' value='" + downid + "'>");
$('body').append($form);
$form.submit();
}
});
</script>
</head>
<body>
要下载的文件名：<input type="text" id="downfile" />
<input type="button" id="btnDownLoad" value="无刷新下载文件" />
<div id="loadingbox" style="display:none;">
正加下载中，请稍候。。。
</div>
</body>
</html>
以下是服务器端代码：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
namespace WebApplication1
{
public partial class WebForm2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Request.HttpMethod == "POST")
{
string getresult = Request.Form["getresult"];
string downId=Request.Form["downid"];
string cacheKey =string.Format("downloadcompleted-{0}-{1}",downId,Request.UserHostAddress);
if (getresult == "Y") //判断是否为获取下载结果的请求
{
string result = (Cache[cacheKey] ?? "N").ToString();
Response.Clear();
Response.Write(result);
if(result=="Y") //如果查询到下载完成，则应清除标记下载完成的CACHE
{
Cache.Remove(cacheKey);
}
Response.End();
return;
}
string fileName = Request.Form["filename"];
string localFilePath = Server.MapPath("~/" + fileName);
System.IO.FileInfo file = new System.IO.FileInfo(localFilePath);
Response.Clear();
Response.ClearHeaders();
Response.Buffer = false;
Response.AddHeader("Content-Disposition", "attachment;filename=" + file.Name);
Response.AddHeader("Content-Length", file.Length.ToString());
Response.ContentType = "application/octet-stream";
Response.WriteFile(file.FullName);
Response.Flush();
Cache.Insert(cacheKey, "Y");//输出所有文件数据后，添加CACHE，并设置downloadcompleted=Y，供页面查询结果使用
Response.End();
}
}
}
}
实现原理：前端通过动态创建FORM用来请求下载的资源，请求参数中必需包含一个downId（我这里还包含了一个要下载的文件名），这个是与服务器端的cache Key相对应的，服务器端接收到下载请求后，会获取下载的文件名及downId,然后依据downId生成一个相对应的cache Key用于标识下载结果，再依据下载文件名获取服务器的文件资源并响应输出文件流供客户端下载，输出完毕后，生成一个Cache，并标记为Y，表明已输出完毕。客户端在下载文件的同时，会每隔3秒请求服务器获取下载完成的Cache标识，若获取到其值为Y，则表明下载完成，服务器立即清除该Cache，客户端作出相应的响应（比如：关闭提示下载的对话框及弹出下载完成的对话框）
效果如下：
经过多个不同的浏览器及大文件压力测试，兼容性良好，都能正常下载并能收到下载完成提示，基于以上原理，可以实现进度条显示，实现原理简述：客户端请求服务器下载资源-->服务器响应并按字节分段依次输出，每次输出时生成CACHE，并保存输出进度，直至全部输出完毕，客户端在请求服务器下载资源的同时，也需要同时每隔几秒请求查询服务器下载进度，直至下载进度为100%停止请求。也可利用HTML5新特性WEBSOCKET技术来实现。
相关推荐
-
asp.net使用npoi读取excel模板并导出下载详解
为什么要使用NPOI导出Excel? 一.解决传统操作Excel遇到的问题: 如果是.NET,需要在服务器端装Office,且及时更新它,以防漏洞,还需要设定权限允许.NET访问COM+,如果在导出过程中出问题可能导致服务器宕机.Excel会把只包含数字的列进行类型转换,本来是文本型的,Excel会将其转成数值型的,比如编号000123会变成123.导出时,如果字段内容以"-"或"="开头,Excel会把它当成公式进行,会报错.Excel会根据Excel文件前8行分
-
在ASP.NET中下载文件的实现代码
这是笔者常被问到的一个问题,如何通过ASP.NET来下载文件,这个问题可大可小,我们先从小的开始.当我们要让用户下载一个文件,最简单的方式是通过Response.Redirect指令: Response.Redirect("test.doc") 您可以把上面这行指令放在Button的Click事件当中,当用户点击按钮之后,网页就会被转址到该word档,造成下载的效果. 但是这样的下载有几个问题: 1. 无法下载不存在的文件:例如,我们若是想把程序动态(临时)产生的文字,当作一个文件下载
-
asp.net生成Excel并导出下载五种实现方法
方法一 通过GridView(简评:方法比较简单,但是只适合生成格式简单的Excel,且无法保留VBA代码),页面无刷新 aspx.cs部分 复制代码 代码如下: using System; using System.Collections; using System.Configuration; using System.Data; using System.Web; using System.Web.Security; using System.Web.UI; using System.We
-
asp.net+jquery ajax无刷新登录的实现方法
因为工作需要研究了一下 js的ajax,下面是成果.主要是三部分:一.js部分 友情提示注意js部分中的 $("#btn_login")中的return false:这个可以阻止回转服务器不然还是会刷新 复制代码 代码如下: $(document).ready(function () { $("#btn_login").click(function () { postlogin(); return false; });});
-
Asp.Net 无刷新文件上传并显示进度条的实现方法及思路
相信通过Asp.Net的服务器控件上传文件在简单不过了,通过AjaxToolkit控件实现上传进度也不是什么难事,为什么还要自己辛辛苦苦来 实现呢?我并不否认"拿来主义",只是我个人更喜欢凡是求个所以然.本篇将阐述通过Html,IHttpHandler和 IHttpAsyncHandler实现文件上传和上传进度的原理,希望对你有多帮助. 效果图: 本文涉及到的知识点:1.前台用到Html,Ajax,JQuery,JQuery UI 2.后台用到一般处理程序(IHttpHandler)和
-
asp.net中Timer无刷新定时器的实现方法
本文实例讲述了asp.net中Timer无刷新定时器的实现方法.Timer控件要实现无刷新,得用到ajax技术,这里使用VS2008自带的ajax技术. 首先得添加一个ScriptManager控件,然后再添加一个UpdatePanel用于存放Timer控件内容的,就可以实现无刷新了.下面是详细的内容: 一.前台代码如下: <form id="form1" runat="server"> <asp:ScriptManager ID="
-
asp.net 30分钟掌握无刷新 Repeater
示例代码下载: /201109/yuanma/JQueryElementTest.rar本文中所包含的内容如下: * 准备 * 主要功能 * 绑定字段 * 绑定属性 * 基本设置 * 设置分页 * 设置字段 * 设置调用的服务端方法 * 请求/返回数据的格式 * 填充/搜索 * 更新 * 删除 * 新建 * 行状态说明 * 排序状态说明 * 设置模板 * ItemTemplate * UpdatedItemTemplate/InsertedItemTemplate * RemovedItemTe
-
asp.net中利用Jquery+Ajax+Json实现无刷新分页的实例代码
复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxJson.aspx.cs" Inherits="AjaxJson" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR
-
asp.net jquery无刷新分页插件(jquery.pagination.js)
采用Jquery无刷新分页插件jquery.pagination.js 实现无刷新分页效果 友情提示:本示例Handler中采用StringBuilder的append方法追加HTML,小数据量可以,但是大数据或是布局常变,建议返回JSON格式的数据,性能和灵活性更好! 1.插件参数列表 2.页面内容: 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Defaul
-
JQuery实现Repeater无刷新批量删除(附后台asp.net源码)
前台页面 复制代码 代码如下: <head runat="server"> <title>无标题页</title> <script src="Js/jquery-1.5.1.min.js" type="text/javascript"></script> <script src="Js/Demo.js" type="text/javascript&qu
-
ASP.NET批量下载文件的方法
本文实例讲述了ASP.NET批量下载文件的方法.分享给大家供大家参考.具体方法如下: 一.实现步骤 在用户操作界面,由用户选择需要下载的文件,系统根据所选文件,在服务器上创建用于存储所选文件的临时文件夹,将所选文件拷贝至临时文件夹.然后调用 RAR程序,对临时文件夹进行压缩,然后输出到客户端.最后删除临时文件夹. 二.代码实现 1.ASP.NET批量下载 核心代码 复制代码 代码如下: //遍历服务器指定文件夹下的所有文件 string path = "uploads/Image/&qu
-
asp.net 简便无刷新文件上传系统
ps:flash实现的效果是好得多,但这不是我研究的范围,也没什么可比性. 兼容:ie6/7/8, firefox 3.5.5, opera 10.01, safari 4.0.3, chrome 3.0 效果预览 文件上传 选择文件 重命名 操作 状态 重置 选择文件 重置 选择文件 重置 选择文件 ps:由于需要后台,要测试系统请下载实例测试. ps2:在完整实例文件中,还有一个文件属性查看实例. 程序说明 [upload] 程序中最重要的方法就是upload了,调用它就可以进行无刷新上传.
-
asp.net ajax实现无刷新验证码
1.首先是在后台验证码的aspx文件的Page_Load中的事件代码: 复制代码 代码如下: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Drawing; namespace 学生在线考试系统 { public partial class
-
Asp.net获取服务器指定文件夹目录文件并提供下载的方法
本文实例讲述了Asp.net获取服务器指定文件夹目录文件并提供下载的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: string dirPath = HttpContext.Current.Server.MapPath("uploads/"); if (Directory.Exists(dirPath)) { //获得目录信息 DirectoryInfo dir = new DirectoryInfo(dirPath);
-
Asp.Net Mvc2 增删改查DEMO附下载
1.List页面,一般List页面主要用来显示数据,本文中的List页面提供,数据显示并且分页.删除操作.新增及修改操作.因为看到园子里面有部分人在使用MVC进行数据显示的时候还在使用ViewData,这里介绍的是强类型显示数据.添加新的视图,在第一行代码可以看到 复制代码 代码如下: <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %> 这里可以定义这个视
-
Asp.net生成Excel文件并下载（更新：解决使用迅雷下载页面而不是文件的问题）
这里采用的是在服务端先生成Excel文件,然后利用文件地址下载的方法. 生成Excel文件的方法,见:[原].Net创建Excel文件(插入数据.修改格式.生成图表)的方法 先试用Response.WriteFile的方法: 复制代码 代码如下: FileInfo fi = new FileInfo(excelFile);//excelFile为文件在服务器上的地址 HttpResponse contextResponse = HttpContext.Current.Response; cont
-
Asp.net实现MVC处理文件的上传下载功能实例教程
上传于下载功能是程序设计中非常常见的一个功能,在ASP.NET程序开发中有着非常广泛的应用.本文就以实例形式来实现这一功能. 一.概述 如果你仅仅只有Asp.net Web Forms背景转而学习Asp.net MVC的,我想你的第一个经历或许是那些曾经让你的编程变得愉悦无比的服务端控件都驾鹤西去了.FileUpload就是其中一个,而这个控件的缺席给我们带来一些小问题.这篇文章主要说如何在Asp.net MVC中上传文件,然后如何再从服务器中把上传过的文件下载下来. 二.实现方法 1.文件上传