asp.net core分块上传文件示例

2024-10-23 03:01:31

写完asp.net多文件上传后，感觉这种上传还是有很多缺陷，于是。。。（省略一万字，不废话）。这里我没用传统的asp.net，而选择了开源的asp.net core，原因很简单，.net core是.net新的开始，更是.net和.net开发者的未来，希望.net发展越来越好（大家的工资越来越高(●ˇ∀ˇ●)）。

1.前端的实现：

1).html：　

<html>
<head>
  <meta name="viewport" content="width=device-width" />
  <title>Index</title>
  <link href="/lib/bootstrap/dist/css/bootstrap.css" rel="external nofollow" rel="stylesheet" />
  <script src="/lib/jquery/dist/jquery.js"></script>
  <script src="/lib/bootstrap/dist/js/bootstrap.js"></script>
  <script src="/js/UploadJs.js"></script>
</head>
<body>
  <div class="row" style="margin-top:20%">
    <div class="col-lg-4"></div>
    <div class="col-lg-4">
      <input type="text" value="请选择文件" size="20" name="upfile" id="upfile" style="border:1px dotted #ccc">
      <input type="button" value="浏览" onclick="path.click()" style="border:1px solid #ccc;background:#fff">
      <input type="file" id="path" style="display:none" multiple="multiple" onchange="upfile.value=this.value">
      <br />
      <span id="output">0%</span>
      <button type="button" id="file" onclick="UploadStart()" style="border:1px solid #ccc;background:#fff">开始上传</button>
    </div>
    <div class="col-lg-4"></div>
  </div>
</body>
</html>

2).javascript：

var UploadPath = "";
//开始上传
function UploadStart() {
  var file = $("#path")[0].files[0];
  AjaxFile(file, 0);
}
function AjaxFile(file, i) {
  var name = file.name, //文件名
  size = file.size, //总大小shardSize = 2 * 1024 * 1024,
  shardSize = 2 * 1024 * 1024,//以2MB为一个分片
  shardCount = Math.ceil(size / shardSize); //总片数
  if (i >= shardCount) {
    return;
  }
  //计算每一片的起始与结束位置
  var start = i * shardSize,
  end = Math.min(size, start + shardSize);
  //构造一个表单，FormData是HTML5新增的
  var form = new FormData();
  form.append("data", file.slice(start, end)); //slice方法用于切出文件的一部分
  form.append("lastModified", file.lastModified);
  form.append("fileName", name);
  form.append("total", shardCount); //总片数
  form.append("index", i + 1); //当前是第几片
  UploadPath = file.lastModified
  //Ajax提交文件
  $.ajax({
    url: "/Upload/UploadFile",
    type: "POST",
    data: form,
    async: true, //异步
    processData: false, //很重要，告诉jquery不要对form进行处理
    contentType: false, //很重要，指定为false才能形成正确的Content-Type
    success: function (result) {
      if (result != null) {
        i = result.number++;
        var num = Math.ceil(i * 100 / shardCount);
        $("#output").text(num + '%');
        AjaxFile(file, i);
        if (result.mergeOk) {
          var filepath = $("#path");
          filepath.after(filepath.clone().val(""));
          filepath.remove();//清空input file
          $('#upfile').val('请选择文件');
          alert("success!!!");
        }
      }
    }
  });
}

这里的主要思路是利用html5 File api的slice方法把文件分块，然后new一个FormData()对象用于储存文件数据，之后就是递归调用AjaxFile方法直至上传完毕。

2.后台C#：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using System.IO;

// For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?LinkID=397860

namespace DotNet.Upload.Controllers
{
  public class UploadController : Controller
  {
    // GET: /<controller>/
    public IActionResult Index()
    {
      return View();
    }

    [HttpPost]
    public async Task<ActionResult> UploadFile()
    {
      var data = Request.Form.Files["data"];
      string lastModified = Request.Form["lastModified"].ToString();
      var total = Request.Form["total"];
      var fileName = Request.Form["fileName"];
      var index = Request.Form["index"];

      string temporary = Path.Combine(@"E:\浏览器", lastModified);//临时保存分块的目录
      try
      {
        if (!Directory.Exists(temporary))
          Directory.CreateDirectory(temporary);
        string filePath = Path.Combine(temporary, index.ToString());
        if (!Convert.IsDBNull(data))
        {
          await Task.Run(() => {
            FileStream fs = new FileStream(filePath, FileMode.Create);
            data.CopyTo(fs);
          });
        }
        bool mergeOk = false;
        if (total == index)
        {
          mergeOk = await FileMerge(lastModified, fileName);
        }

        Dictionary<string, object> result = new Dictionary<string, object>();
        result.Add("number", index);
        result.Add("mergeOk", mergeOk);
        return Json(result);

      }
      catch (Exception ex)
      {
        Directory.Delete(temporary);//删除文件夹
        throw ex;
      }
    }

    public async Task<bool> FileMerge(string lastModified,string fileName)
    {
      bool ok = false;
      try
      {
        var temporary = Path.Combine(@"E:\浏览器", lastModified);//临时文件夹
        fileName = Request.Form["fileName"];//文件名
        string fileExt = Path.GetExtension(fileName);//获取文件后缀
        var files = Directory.GetFiles(temporary);//获得下面的所有文件
        var finalPath = Path.Combine(@"E:\浏览器", DateTime.Now.ToString("yyMMddHHmmss") + fileExt);//最终的文件名（demo中保存的是它上传时候的文件名，实际操作肯定不能这样）
        var fs = new FileStream(finalPath, FileMode.Create);
        foreach (var part in files.OrderBy(x => x.Length).ThenBy(x => x))//排一下序，保证从0-N Write
        {
          var bytes = System.IO.File.ReadAllBytes(part);
          await fs.WriteAsync(bytes, 0, bytes.Length);
          bytes = null;
          System.IO.File.Delete(part);//删除分块
        }
        fs.Close();
        Directory.Delete(temporary);//删除文件夹
        ok = true;
      }
      catch (Exception ex)
      {
        throw ex;
      }
      return ok;
    }

  }
}

这里的思路就是先保存每一个分块的文件到一个临时文件夹，最后再通过FileStream合并这些临时文件（合并时必需要按顺序）。后台的方法都进行了异步化（async await真的非常好用），虽然不知道对效率有没有提升，但是就是觉得这样很酷。

源码下载：DotNet_jb51.rar

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

解决ASP.NET Core Mvc文件上传限制问题实例

一.简介在ASP.NET Core MVC中,文件上传的最大上传文件默认为20MB,如果我们想上传一些比较大的文件,就不知道怎么去设置了,没有了Web.Config我们应该如何下手呢? 二.设置上传文件大小 1.应用程序级别设置我们需要在 ConfigureServices方法中添加如下代码,设置文件上传的大小限制为60 MB. public void ConfigureServices(IServiceCollection services) { servicesConfigure<For
asp.net core实现文件上传功能

本文实例为大家分享了单文件上传.多文件上传的功能,供大家参考,具体内容如下单文件上传上传文件在Web应用程序中是一个常见的功能.在asp.net core中上传文件并保存在服务器上,是很容易的.下面就来演示一下怎么样在 ASP.NET Core项目中进行文件上传. 首先,创建一个 asp.net core 项目,然后在Controller文件件添加一个HomeController,然后在 Views 文件夹的 Home 文件夹里添加一个 New.cshtml 视图文件.如下图: 添加一个
asp.net core集成kindeditor实现图片上传功能

本文为大家分享了asp.net core 如何集成kindeditor并实现图片上传功能的具体方法,供大家参考,具体内容如下准备工作 1.visual studio 2015 update3开发环境 2.net core 1.0.1 及以上版本目录新建asp.net core web项目下载kindeditor 增加图片上传控制器配置kindeditor参数代码下载新建asp.net core web项目新建一个asp.net core项目,这里命名为kindeditor 选中w
asp.net core mvc实现文件上传实例

工作用到文件上传的功能,在这个分享下 ~~ Controller: public class PictureController : Controller { private IHostingEnvironment hostingEnv; public PictureController(IHostingEnvironment env) { this.hostingEnv = env; } // GET: /<controller>/ public IActionResult Index()
asp.net core分块上传文件示例

写完asp.net多文件上传后,感觉这种上传还是有很多缺陷,于是...(省略一万字,不废话).这里我没用传统的asp.net,而选择了开源的asp.net core,原因很简单,.net core是.net新的开始,更是.net和.net开发者的未来,希望.net发展越来越好(大家的工资越来越高(●ˇ∀ˇ●)). 1.前端的实现: 1).html: <html> <head> <meta name="viewport" content="widt
AngularJS向后端ASP.NET API控制器上传文件

本文实例介绍了前端AngularJS向后端ASP.NET Web API上传文件的实现方法,具体内容如下首先服务端: public class FilesController : ApiController { //using System.Web.Http [HttpPost] public async Task<HttpResponseMessage> Upload() { if(!Request.Content.IsMimeMultipartContent()) { this.Requ
jquery uploadify和apache Fileupload实现异步上传文件示例

jQuery Uploadify + Apache Fileupload异步上传文件示例1.可以限制上传文件大小和类型,理论上任何类型的文件都可以上传(自己根据api配置即可):2.后台使用Apache commons-fileupload-1.3.1.jar作为上传工具包,本示例支持一次性多文件上传:3.文件上传目录可以任意指定,请在web.xml中配置:Uploadify api 详见http://www.uploadify.com/documentation/ FileUploadServ
Python调用scp向服务器上传文件示例

最近做的项目中有一个小功能:在python中调用scp命令使用ssh登录,然后将指定目录中的图片上传到服务器指定目录网上搜了很多方法都没用,最后终于碰到一个可以成功上传的,特此记录 import paramiko # 用于调用scp命令 from scp import SCPClient # 将指定目录的图片文件上传到服务器指定目录 # remote_path远程服务器目录 # file_path本地文件夹路径 # img_name是file_path本地文件夹路径下面的文件名称 def u
springmvc利用jquery.form插件异步上传文件示例

需要的下载文件: jQuery.form.js jquery.js commons-fileupload.jar commons-io.jar 示例图片 pom.xml  <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.3</ve
PHP实现ftp上传文件示例

FTP上传是PHP实现的一个常见且非常重要的应用技巧,今天就来与大家分享一下PHP实现FTP上传文件的简单示例.希望对大家的PHP学习能带来一定的帮助. 主要代码如下: function make_directory($ftp_stream, $dir){ // if directory already exists or can be immediately created return true if ($this->ftp_is_dir($ftp_stream, $dir) || @ftp
Yii2实现UploadedFile上传文件示例

闲来无事,整理了一下自己写的文件上传类. 通过 UploadFile::getInstance($model, $attribute); UploadFile::getInstances($model, $attribute); UploadFile::getInstanceByName($name); UploadFile::getInstancesByName($name); 把表单上传的文件赋值到 UploadedFile中的 private static $_files 中 /**
java使用ftp上传文件示例分享

复制代码代码如下: import java.io.ByteArrayInputStream; import java.io.FileOutputStream; import java.io.IOException; import java.net.SocketException; import java.text.SimpleDateFormat; import java.util.Date; import org.apache.commons.io.IOUtils; import
asp.net fileupload控件上传文件与多文件上传

1.前台文件 Default.aspx: <%@ Page Language="C#" AutoEventWireup="true"CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.
解决asp.net上传文件超过了最大请求长度的问题

错误消息:超过了最大请求长度错误原因:asp.net默认最大上传文件大小为4M,运行超时时间为90S. 解决方案 1. 修改web.config文件可以改变这个默认值 <configuration> <system.web> <httpRuntime maxRequestLength="1048576" executionTimeout="3600" /> </system.web> <configuratio

asp.net core分块上传文件示例

相关推荐

随机推荐