Question

美好的一天！

我正在开发一个ASP.NET Web API 2项目。在某一点上，需要上传一些文件。这些文件需要链接到某个FileModel（我们自己的类）。因此，客户端需要将IEnumerable作为参数发送，将文件作为内容发送。因为它是一个RESTful API，所以两者都必须在同一个请求中发送。

我们能想到的最好的是控制器操作：

public async Task<HttpResponseMessage> Add([FromUri] IEnumerable<FileModel> fileModels)
{
   // REQUEST INTEGRITY TESTING

   var streamProvider = new CustomMultipartFormDataStreamProvider(fileSavePath, fileModels);
   // Read the MIME multipart content using the stream provider we just created.
   var work = await Request.Content.ReadAsMultipartAsync(streamProvider).ContinueWith(async t =>
        {
            // SOME WORK DONE AFTER SAVING THE FILES TO THE HARD DRIVE
        }

}

问题如下：使用'multipart / form-data'Content-Type标头上传文件。 在操作服务器端的文件之前，我们需要知道FileModels的内容。如果我们使用MultipartFormDataStreamProvider，我们只能在文件保存到硬盘后才能访问非文件参数。

我们可以找到的唯一解决方法是发送IEnumerable＆lt; FileModel＆gt; URL中的参数。但鉴于URL的最大长度有限，这不是一种可靠的方法。

问题是：有没有办法提交IEnumerable＆lt; FileModel＆gt; fileModels参数和请求正文中的文件，并在访问文件之前访问fileModels参数？我们还希望能够使用HttpContext.Current.Request.Files.Count;

我们当前用于文件上传的jQuery看起来像这样（为了早期测试目的，它只支持一个文件上传）：

$('#Upload').click(function(e) {
            e.preventDefault();

            var headers = new Array();
            headers["SessionId"] = sessionId;

            var files = $('#fileInput').get(0).files;
            var formData = new FormData();
            formData.append("files", files[0]);

            var fileModel = $('#fileSubmission').serialize();

            $.ajax({
                url: "api/Submissions/Add/?" + fileModel,
                headers: headers,
                type: 'POST',
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                dataType: 'json'
            });
        });

非常感谢！

Answer 1

对于迟到的答案我很抱歉，但我们解决了问题（我忘记了我没有在这里上传答案）。基本上我们所做的是在临时位置调用ReadAsMultiPartAsync方法，然后从请求中提取其他参数。之后，我们验证了输入并将文件从临时位置移动到永久位置。

如果您想查看代码，这对我们的特定示例有用，我相信它很适合任何工作案例场景：

在客户端，我们有以下形式（是的，此实现仅用于演示目的，仅支持发送一个文件...另外，输入类型=“文件”字段确实在表单之外; fileId在我们的案例中手动完成文本输入，仅用于测试目的）

<input type="file" name="data" id="fileInput" multiple="multiple" />

<form id="fileSubmission">            
    <input type="text" width="10" onchange="getFileDetails()" autocomplete="off" placeholder="FileId" name="files[0].Id" id="fileId" /> 
    <input type="hidden" name="files[0].FileName" id="FileName"/>
    <input type="hidden" name="files[0].Extension" id="Extension"/>
    <input type="hidden" name="files[0].EntityId" id="EntityId"/>
    <br /><br />
    <input type="submit" id="Upload" value="Upload" />
</form>

其中getFileDetails（）填充其他输入字段。此外，使用以下jQuery / Javascript将表单发送到服务器：

$('#Upload').click(function(e) {
            e.preventDefault();

            var courseId = $('#courseId').val();
            var fileId = $('#fileId').val();
            if (!courseId || !fileId) {
                return;
            }

            var headers = new Array();
            headers["SessionId"] = sessionId;
            headers["contentType"] = "application/json; charset=UTF-8";

            var formData = new FormData();
            var opmlFile = $('#fileInput').get(0).files;

            // this is like the model we're expecting on the server
            var files = [];
            files.push({ 'Id': $('#fileId').val(), 'OriginalFileName': opmlFile[0].name, 'FileName': $('#FileName').val(), 'Extension': $('#Extension').val(), 'EntityId': $('#EntityId').val() });

            formData.append("fileModels", JSON.stringify(files));
            formData.append("File_0", opmlFile[0]);


            $.ajax({
                url: "api/Courses/" + courseId + "/Submissions/Add/",
                headers: headers,
                type: 'POST',
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                dataType: 'json'
            });
        });

在服务器端，我们有以下内容：

// POST: api/Courses/{courseId}/Submissions/Add
[HttpPost]
[ValidateModelState]
[ValidateMimeMultipartContent]
[PermissionsAuthorize(CoursePermissions.CanCreateSubmissions)]
public async Task<HttpResponseMessage> Add(int courseId)
    {
        // the same as in the jQuery part
        const string paramName = "fileModels";

        // Put the files in a temporary location
        // this way we call ReadAsMultiPartAsync and we get access to the other data submitted
        var tempPath = HttpContext.Current.Server.MapPath("~/App_Data/Temp/" + Guid.NewGuid());
        Directory.CreateDirectory(tempPath);

        var streamProvider = new MultipartFormDataStreamProvider(tempPath);
        var readResult = await Request.Content.ReadAsMultipartAsync(streamProvider);

        if (readResult.FormData[paramName] == null)
        {
            // We don't have the FileModels ... delete the TempFiles and return BadRequest
            Directory.Delete(tempPath, true);
            return Request.CreateResponse(HttpStatusCode.BadRequest);
        }

        // The files have been successfully saved in a TempLocation and the FileModels are not null
        // Validate that everything else is fine with this command
        var fileModels = JsonConvert.DeserializeObject<IEnumerable<FileModelExtension>>(readResult.FormData[paramName]).ToList();

        // AT THIS POINT, ON THE SERVER, WE HAVE ALL THE FILE MODELS 
        // AND ALL THE FILES ARE SAVED IN A TEMPORARY LOCATION

        // NEXT STEPS ARE VALIDATION OF THE INPUT AND THEN 
        // MOVING THE FILE FROM THE TEMP TO THE PERMANENT LOCATION

        // YOU CAN ACCESS THE INFO ABOUT THE FILES LIKE THIS:
        foreach (var tempFile in readResult.FileData)
            {
                var originalFileName = tempFile.Headers.ContentDisposition.FileName.Replace("\"", string.Empty);

                var localTempPath = tempFile.LocalFileName;
            }

    }

我希望这可以帮助那些尝试使用Post请求一次向服务器提交文件和其他参数的人！：）

注意：服务器上使用的某些属性是自定义的。 PermissionAuthorize，ValidateModelState和ValidateMimeMultiPartContent是我们使用的自定义过滤器。后两者的实施受到http://benfoster.io/blog/automatic-modelstate-validation-in-aspnet-mvc
的启发
multipartcontent属性只检查actionContext.Request.Content.IsMimeMultipartContent（），如下所示：

public class ValidateMimeMultipartContent : ActionFilterAttribute { public override void OnActionExecuting(HttpActionContext actionContext) { if (!actionContext.Request.Content.IsMimeMultipartContent()) { actionContext.Response = actionContext.Request.CreateErrorResponse(HttpStatusCode.UnsupportedMediaType, Messages.UnsupportedMediaType); } } }

如何将文件上传到Web API服务器并将参数发送到操作？

1 个答案: