您的位置：首页 > 编程技术 > csharp  >  实现ASP.NET无刷新下载并提示下载完成的开发思路

实现ASP.NET无刷新下载并提示下载完成的开发思路

 更新时间：2020年6月25日 11:26  点击：1538

先给大家贴代码了，后面给大家在做具体的文字说明。

以下是前端代码：

<%@ 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技术来实现。

[!--infotagslink--]

相关文章

  • ASP.NET购物车实现过程详解

    这篇文章主要为大家详细介绍了ASP.NET购物车的实现过程，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2021-09-22

  • 在ASP.NET 2.0中操作数据之七十二：调试存储过程

    在开发过程中，使用Visual Studio的断点调试功能可以很方便帮我们调试发现程序存在的错误，同样Visual Studio也支持对SQL Server里面的存储过程进行调试，下面就让我们看看具体的调试方法。...2021-09-22

  • C#实现HTTP下载文件的方法

    这篇文章主要介绍了C#实现HTTP下载文件的方法,包括了HTTP通信的创建、本地文件的写入等,非常具有实用价值,需要的朋友可以参考下...2020-06-25

  • php无刷新利用iframe实现页面无刷新上传文件(1/2)

    利用form表单的target属性和iframe 一、上传文件的一个php教程方法。 该方法接受一个$file参数，该参数为从客户端获取的$_files变量，返回重新命名后的文件名，如果上传失...2016-11-25

  • jQuery+PHP发布的内容进行无刷新分页（Fckeditor）

    这篇文章将使用jQuery，并结合PHP，将Fckeditor发布的内容进行分页，并且实现无刷新切换页面。 本文假设你是WEB开发人员，掌握了jQuery和PHP相关知识，并且熟知Fckeditor的配置和使用。...2015-10-23

  • php实现文件下载实例分享

    举一个案例：复制代码 代码如下:<?phpclass Downfile { function downserver($file_name){$file_path = "./img/".$file_name;//转码，文件名转为gb2312解决中文乱码$file_name = iconv("utf-8","gb2312",$file_name...2014-06-07

  • Visual Studio 2015下载和安装图文教程

    这篇文章主要为大家详细介绍了Visual Studio 2015下载和安装图文教程，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2021-09-22

  • ASP.NET Core根据环境变量支持多个 appsettings.json配置文件

    这篇文章主要介绍了ASP.NET Core根据环境变量支持多个 appsettings.json配置文件，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧...2021-09-22

  • 记一次EFCore类型转换错误及解决方案

    这篇文章主要介绍了记一次EFCore类型转换错误及解决方案，帮助大家更好的理解和学习使用asp.net core，感兴趣的朋友可以了解下...2021-09-22

  • 基于jquery实现表格无刷新分页

    这篇文章主要介绍了基于jquery实现表格无刷新分页，功能实现了前端排序功能，增加了前端搜索功能，感兴趣的小伙伴们可以参考一下...2016-01-08

  • 基于JavaScript代码实现微信扫一扫下载APP

    有很多人在做微信的扫一扫下载。但是在微信更新之后微信将该功能给禁止掉了，也不能说是全面禁止吧，因为腾讯、微信是一家嘛，通过应用宝审核的应用好像还是可以通过扫一扫直接下载的，下面通过本篇文章给大家介绍微信扫一扫下载app的代码片段，感兴趣的朋友一起看看吧...2016-01-02

  • php+ajax制作无刷新留言板

    本文就是和大家分享一款由php结合ajax实现的无刷新留言板，先给大家看一下最后的效果图：数据库连接代码如下： <&#63;php$conn = @mysql_connect("localhost","root","root") or die ("MySql连接错误");mysql_select_db("d...2015-10-30

  • 详解ASP.NET Core 中基于工厂的中间件激活的实现方法

    这篇文章主要介绍了ASP.NET Core 中基于工厂的中间件激活的实现方法，本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下...2021-09-22

  • Javascript前端下载后台传来的文件流代码实例

    这篇文章主要介绍了Javascript前端下载后台传来的文件流代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2020-08-19

  • ASP.NET 2.0中的数据操作:使用两个DropDownList过滤的主/从报表

    在前面的指南中我们研究了如何显示一个简单的主/从报表, 该报表使用DropDownList和GridView控件, DropDownList填充类别,GridView显示选定类别的产品. 这类报表用于显示具有...2016-05-19

  • asp.net通过消息队列处理高并发请求(以抢小米手机为例)

    这篇文章主要介绍了asp.net通过消息队列处理高并发请求(以抢小米手机为例)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧...2021-09-22

  • ASP.NET单选按钮控件RadioButton常用属性和方法介绍

    RadioButton又称单选按钮，其在工具箱中的图标为 ，单选按钮通常成组出现，用于提供两个或多个互斥选项，即在一组单选钮中只能选择一个...2021-09-22

  • 在PHP中使用X-SendFile头让文件下载更快

    一般来说, 我们可以通过直接让URL指向一个位于Document Root下面的文件, 来引导用户下载文件.但是, 这样做, 就没办法做一些统计, 权限检查, 等等的工作. 于是, 很多时候, 我们采用让PHP来做转发, 为用户提供文件下载...2014-06-07

  • C#开发教程之FTP上传下载功能详解

    这篇文章主要为大家详细介绍了C#开发教程之FTP上传下载功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2020-06-25

  • ASP.NET中iframe框架点击左边页面链接 右边显示链接页面内容

    这篇文章主要介绍了ASP.NET中iframe框架点击左边页面链接,右边显示链接页面内容的实现代码，感兴趣的小伙伴们可以参考一下...2021-09-22