【问题标题】:How can I get a posted file on server-side from an Ajax Request in asp.net-webpages?如何从 asp.net-webpages 中的 Ajax 请求获取服务器端发布的文件?
【发布时间】:2013-10-09 19:04:33
【问题描述】:

使用我在这里找到的有用信息:

How can I upload files asynchronously?

我能够使用以下 jQuery 将表单数据获取到服务器端(对上面的链接稍作修改):

$('#addFileInput').change(function () {
    var file = this.files[0];
    name = file.name;
    size = file.size;
    type = file.type;
    //Your validation
});

$('.submitFile').click(function () {
    var formData = new FormData($("#fileUploadForm"));
    $.ajax({
        url: '/AJAX Pages/Compute_File_Upload.cshtml',  //Server script to process data
        type: 'POST',
        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;
        },
        //Ajax events
        beforeSend: function () {
            $("#progressBar").css("visibility", "visible");
        },
        success: function (response) {
            $(".editLabelTitle").text(response);
        },
        //error: errorHandler,
        // Form data
        data: formData,
        //Options to tell jQuery not to process data or worry about content-type.
        cache: false,
        contentType: false,
        processData: false
    });
});

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

以下是所涉及的 HTML:

<div class=\"addFileBox\">
    <div class=\"editPageSubTitle dragHandle\">
        Add File
        <button id=\"closeAddFileBox\">X</button>
    </div>
    <div class=\"innerAddFileDiv\">
        <form id=\"fileUploadForm\" enctype=\"multipart/form-data\">
            <input id=\"addFileInput\" name=\"addFileInput\" type=\"file\" />
        </form>
        <br/>
        <progress id=\"progressBar\"></progress>
        <br/>
        <button class=\"submitFile\">Submit File</button>
    </div>
</div>

Ajax 请求本身可以正常工作。当我不知道如何在服务器端代码上获取文件时,问题就出现了(通常我只会使用Request.Files["someFileId"]) 找到输入,但由于发送了所有 formData,这不是我熟悉的方式与。

C# 代码隐藏

@{
Layout = "";

if(IsAjax)
{
    var file = Request.Files["addFileInput"];

    var fileName = Path.GetFileName(file.FileName);
    var path = Path.Combine(Server.MapPath("~/CMS Files/UtilityBilling"), fileName);
    file.SaveAs(path);
}

}

考虑到我的场景和环境,访问给定文件的正确方法是什么?

【问题讨论】:

  • 理论上,您访问它的方式与访问它的方式相同,就好像它是使用
    标签发布的一样。
  • @KevinB 这就是我的代码现在设置的方式,但我在var fileName = Path.GetFileName(file.FileName); 行收到“对象引用未设置为对象实例”错误。
  • @KevinB 我以前在常规形式的帖子中使用过Request.Files。您确定它应该以相同的方式访问吗?我想知道...
  • 我不熟悉 asp/C#,我只知道使用 FormData 对象发送 ajax 请求,因为 POST 数据类型的数据应该模仿普通表单发布的数据。您是否包含了正确的 enctype,就像您需要在发布文件的普通表单元素上一样?
  • @KevinB 如果您的意思是将enctype 属性放在表单标签中,例如:&lt;form enctype="multipart/form-data"&gt; 那么是的,我就是这样做的。

标签: c# jquery ajax webmatrix asp.net-webpages


【解决方案1】:

从代码隐藏试试这个:

        HttpFileCollection filesCollection = HttpContext.Current.Request.Files;
        var fileName = filesCollection[0];
        string filePath = Path.Combine(HttpContext.Current.Server.MapPath("~/SaveDir"), fileName.FileName);
        fileName.SaveAs(filePath);

【讨论】:

  • 好吧,我真的不应该那样做,因为我处理的不是一组文件,一次只处理一个文件。
  • 无论如何我都会尝试,不过,我必须在 for 或 foreach 循环中使用它,不是吗?
  • 好的,我试过了foreach (var file in filesCollection) { var fileName = Path.GetFileName(file.FileName); var path = Path.Combine(Server.MapPath("~/CMS Files/UtilityBilling"), fileName); file.SaveAs(path); }
  • @VoidKing 是一个集合,您可以使用他的索引访问文件,例如:filesCollection[0].FileName
  • 嗯,这就是我收集的内容。使用我的帖子中显示的方法,它应该模仿常规形式的帖子。但是,我无法按名称访问单个文件(我之前已在常规表单帖子中成功使用Request.Files["inputName"],并且再次,它应该工作......但它没有。那话虽如此,这个答案至少可以让它发挥作用,即使它与我想要的有点不同。谢谢克里斯蒂安。
猜你喜欢
  • 2012-03-24
  • 1970-01-01
  • 1970-01-01
  • 2016-01-03
  • 2016-02-27
  • 2021-08-15
  • 1970-01-01
  • 2019-06-01
  • 2021-12-12
相关资源
最近更新 更多