c#之如何使用 jquery 和 Web API 上传文件

我正在尝试从 jQuery 和 web api 上传文件。如果我只上传文件，它就可以工作。如果我向其中添加更多数据，它就不起作用。下面是代码； JQuery 代码:

<script type="text/javascript"> 
        $(document).ready(function () { 
            $("#button1").click(OnUpload); 
        }); 
 
        function OnUpload(evt) { 
            //var files = $("#file1").get(0).files; 
            var request = { 
                Name: "test", 
                Address: "address", 
                Description: "desc", 
                City: "city", 
                files:$("#file1").get(0).files 
            }; 
 
            var jsonData = JSON.stringify(request); 
 
            if (files.length > 0) { 
                if (window.FormData !== undefined) { 
                    var data = new FormData(); 
                    for (i = 0; i < files.length; i++) { 
                        data.append("file" + i, files[i]); 
                    } 
                    $.ajax({ 
                        type: "POST", 
                        url: "http://localhost:51801/api/FileUpload/", 
                        contentType: false, 
                        processData: false, 
                        data: jsonData + files, 
                        success: function (results) { 
                            for (i = 0; i < results.length; i++) { 
                                alert(results[i]); 
                            } 
                        } 
                    }); 
                } else { 
                    alert("This browser doesn't support HTML5 multiple file uploads!"); 
                } 
            } 
        } 
    </script> 

C# 网络 API 代码:

public HttpResponseMessage Post(RequestP req) 
        { 
            HttpResponseMessage result = null; 
            var httpRequest = HttpContext.Current.Request; 
            if (httpRequest.Files.Count > 0) 
            { 
                var docfiles = new List<string>(); 
                foreach (string file in httpRequest.Files) 
                { 
                    var postedFile = httpRequest.Files[file]; 
                    var filePath = HttpContext.Current.Server.MapPath("~/" + postedFile.FileName); 
                    postedFile.SaveAs(filePath); 
 
                    docfiles.Add(filePath); 
                } 
                result = Request.CreateResponse(HttpStatusCode.Created, docfiles); 
            } 
            else 
            { 
                result = Request.CreateResponse(HttpStatusCode.BadRequest); 
            } 
            return result; 
        } 
    } 
 
public class RequestP 
    { 
        public string Name { get; set; } 
        public string Address { get; set; } 
        public string Description { get; set; } 
        public string City { get; set; } 
        public List<HttpPostedFileBase> files { get; set; } 
    } 

将 HttpPostedFileBase 从 MVC Controller 传递到 ApiController 也会有所帮助。

请您参考如下方法:

我不确定我是否回答晚了，但也许这会帮助其他人解决您的问题。

这对我有用:

HTML 文件/Mvc View :

@{ 
    ViewBag.Title = "Home Page"; 
} 
 
<label for="txtFile">Upload file: </label> 
<input type="file" id="txtFile" name="file" /> 
<br /> 
<a href="#" id="lnkUploadFile">Upload File</a> 
 
<script> 
    $(function () 
    { 
        var $txtFile = $('#txtFile'), 
            files; 
        var data = new FormData(); 
        $('#lnkUploadFile').click(function () 
        { 
            uploadFile(); 
        }); 
 
        function uploadFile() 
        { 
            if ($txtFile.length) 
            { 
                files = $txtFile[0].files; 
                data.append("UploadedImage", files[0]); 
                data.append("ImageName", 'MyImage'); 
            } 
 
            $.ajax({ 
                type: "POST", 
                url: "/api/FileUpload/", 
                contentType: false, 
                processData: false, 
                data: data 
            }).then(function () { }); 
        } 
 
 
    }); 
 
</script> 

网络 API Controller :

namespace MvcApplication1.Controllers 
{ 
    public class FileUploadController : ApiController 
    { 
        // POST api/fileupload 
        public void Post() 
        { 
            if (HttpContext.Current.Request.Files.AllKeys.Any()) 
            { 
                // Get the uploaded image from the Files collection 
                var httpPostedFile = HttpContext.Current.Request.Files["UploadedImage"]; 
 
                if (httpPostedFile != null) 
                { 
                    // Get the complete file path 
                    String fileSavePath = HttpContext.Current.Server.MapPath("~/Content/Images/") + HttpContext.Current.Request.Form["ImageName"].ToString(); 
 
                    // Save the uploaded file to "UploadedFiles" folder 
                    httpPostedFile.SaveAs(fileSavePath); 
                } 
            } 
        }         
    } 
} 

希望这对您有所帮助。