当前位置: 首页 > 面试题库 >

如何在ASP.NET MVC中处理HTML5多文件上传?

白泽语
2023-03-14
问题内容

我发现了以下很棒的主题,并解释了如何使用新的HTML5 FormDataAPI通过AJAX / Jquery上传文件

这是该代码的稍有更新的版本,具有更新的JQuery 1.8+语法

$(':button').click(function(){
    var formData = new FormData($('form')[0]);
    $.ajax({
        url: '/Upload',  //my ASP.NET MVC method
        type: 'POST',
        // handle the progress report
        xhr: function() {  // Custom XMLHttpRequest
            var myXhr = $.ajaxSettings.xhr();
            if(myXhr.upload){ // Check if upload property exists
                myXhr.upload.addEventListener('progress',progressHandlingFunction,    false); // For handling the progress of the upload
            }
            return myXhr;
        },

        // Form data
        data: formData,

        //Options to tell jQuery not to process data or worry about content-type.
        cache: false,
        contentType: false,
        processData: false
    })
    .done(function(){
        alert("success");
    })
    .fail(function(){
        alert("error");
    });
});

function progressHandlingFunction(e){
    if(e.lengthComputable){
        $('progress').attr({value:e.loaded,max:e.total});
    }
}

这是表格

<form enctype="multipart/form-data">
    <input name="file" type="file" />
    <input type="button" value="Upload" />
</form>
<progress></progress>

服务器端,我们有类似的东西。

[HttpPost]
public string Upload(HttpPostedFileBase file)
{
    // do something with file
    return "you uploaded a file called " + file.FileName;
}

这很好。直到您决定在文件对话框中使用“多个”属性,然后发送多个文件。

<form enctype="multipart/form-data">
    <input name="file" type="file" multiple="multiple" />
    <input type="button" value="Upload" />
</form>
<progress></progress>

您会在网上找到各种页面,提出以下解决方案

public string Upload(IEnumerable<HttpPostedFileBase> files)
{
    foreach(var file in files)
         ...
}

哎呀。不起作用

public string Upload(List<HttpPostedFileBase> files)
{
    foreach(var file in files)
         ...
}

不。不起作用

public string Upload(IEnumerable files)
{
    foreach(var file in files)
         ...
}

甚至不 编译

public string Upload(HttpPostedFileBase[] files)
{
    foreach(HttpPostedFileBase file in files)
         ...
}

你猜怎么了?不起作用 让我们尝试处理Request.Files。好的旧的可靠Request.Files。从未失败。

public string Upload()
{
    foreach (HttpPostedFileBase uf in Request.Files)
         ...
}

剧透警报:它不起作用。

啊哈 得到它了!我将遍历Request.Files中的键。

public string Upload()
{
    foreach(var key in Request.Files.AllKeys)
    {
        var file = Request.Files[key];
    }
}

再一次,它不起作用。


问题答案:

什么 的工作,就是下面,从博客总是可靠的,动态的头发里克施特拉尔的

public string Upload()
{
    for (int i = 0; i < Request.Files.Count; i++)
    {
        var file = Request.Files[i];
    } 
}

这背后的原因是传递给Request.Files 所有 文件的文件集 具有相同的名称 ,因为它们来自单个文件上传对话框。

服务器端方法传递了 一个 包含文件的对象,由于某种原因,Request.Files是获取该文件的唯一方法。

希望我可以通过添加一些内容来减轻某些人的头痛。



 类似资料:
  • 问题内容: 我想使用PHP上传文件,但问题是我不知道要上传多少文件。 我的问题是,如果使用该如何上传文件? 我将仅添加“文件”框,并使用JavaScript创建更多要上传的文件输入,但是如何在PHP中处理它们呢? 问题答案: 请参阅:$ _FILES ,处理文件上传

  • 问题内容: 我遇到了这个简单的js ajax上传代码(由于某种原因,jquery 似乎不适用于HTML5), 但是我这里有两个问题, 这条线在物体之后是什么意思? 为什么在那里需要ID?我能做些什么使用jQuery 用? 此ajax仅用于单个文件上传,如何更改多个文件上传? 问题答案: 这行在对象FormData之后是什么意思? 在得到由它的ID元件。该抓住从元件中的第一选择的文件。将其追加到与字

  • 问题内容: 我正在编写一个简单的命令行Java实用程序。我希望用户能够使用运算符传递相对于其主目录的文件路径。所以像 我的问题是有没有办法让Java自动解决这种类型的路径?还是需要为操作员扫描文件路径? 似乎应该将这种类型的功能烘焙到对象中。但这似乎并非如此。 问题答案: 在大多数情况下,从用户处获得一个简单的字符(在转换之前)就足够了- 因为波浪号仅在路径目录部分的第一个字符时才扩展到主目录。

  • 问题内容: 我正在尝试使用以下代码:- 我没有得到结果。 问题答案: 您可以使用AutoIT或JAVA代码。下面我将两者都用作您的参考。尝试任何一个 AutoIt中的代码是 希望这给你一个主意

  • 你想处理一个由用户上传的文件,比如你正在建设一个类似Instagram的网站,你需要存储用户拍摄的照片。这种需求该如何实现呢? 要使表单能够上传文件,首先第一步就是要添加form的enctype属性,enctype属性有如下三种情况: application/x-www-form-urlencoded 表示在发送前编码所有字符(默认) multipart/form-data 不对字符

  • 我有一个开关声明,它检查提交的文本中是否存在特定的字符串。 通常,我会创建专用的文件来处理每个的POST数据。 但是如何在一个中处理多个POST。 对于每个ajax数据,我都包含了一个唯一的标识符,这将作为PHP接收到的ajax的参考 但我不确定如何正确地编写PHP代码来处理提交的$_POST类型。