首页 > 解决方案 > ASP.Net Web Api & Angularjs:多个文件上传

问题描述

我无法将上传的文件传递到控制器中。

这是我的控制器:

[System.Web.Http.HttpPost]
[System.Web.Http.Authorize(Roles = "Admin")]
public string UploadFile()
{
    var file = HttpContext.Current.Request.Files.Count > 0 ? HttpContext.Current.Request.Files[0] : null;

    if (file != null && file.ContentLength > 0)
    {
        var fileName = Path.GetFileName(file.FileName);

        var path = Path.Combine(
            HttpContext.Current.Server.MapPath("~/uploads"),
            fileName
        );

        file.SaveAs(path);
    }

    return Helpers.JsonHelper.Stringify(new { success = true });
}

这是Angularjs:

var uploadFileToUrl = function (file, uploadUrl, progressCB) {

    var token = $('input[name="__RequestVerificationToken"]').val();

    var form = new FormData();
    $(file).each(function (i, el) {
        form.append('file', el, el.name);
    })

    $http.post(uploadUrl, form, {
        headers: { "Authorization": "Basic " + token, "Content-Type": 'multipart/form-data' },
        uploadEventHandlers: {
            progress: progressCB
        }
    });
}

调用之前uploadFileToUrl,文件被设置setViewValue()为在上传(预览)之前显示图像。

所以指令中的某处有:

app.directive("selectNgFiles", function () {
    return {
        require: "ngModel",
        link: function postLink(scope, elem, attrs, ngModel) {
            elem.on("change", function (e) {
                var files = elem[0].files;
                ngModel.$setViewValue(files);
            })
        }
    }
});

但我想这不会导致问题吧?

问题是它HttpContext.Current.Request.Files总是空的,即使我已经将它设置在formData. 为什么总是空的?


笔记

请从 Chrome 中查看附加的调试图像。

在此处输入图像描述 在此处输入图像描述

标签: angularjsasp.net-mvcasp.net-web-api

解决方案


推荐阅读