使用 ng-file-upload 和 WebApi 上传 CustomData答案

【问题标题】：Uploading CustomData with ng-file-upload and WebApi使用 ng-file-upload 和 WebApi 上传 CustomData
【发布时间】：2016-09-15 13:56:05
【问题描述】：

我正在尝试将文件连同一些元数据上传到我使用 ng-file-upload 和 Angular 创建的 WebApi 服务。我按预期获得了文件名和字节，但我也无法获得我传递的元数据。这是我在 Angular 方面所做的事情

            Upload.upload({
                url: '/api/FileStorage/AddContent' + location.search,
                data: {file: files, year: vm.year }
            })

还有 WebApi 方面

       var streamProvider = new CustomMultipartFileStreamProvider();
                IEnumerable<HttpContent> parts = null;
                Task.Factory
                    .StartNew(() => parts = Request.Content.ReadAsMultipartAsync(streamProvider).Result.Contents,
                        CancellationToken.None,
                        TaskCreationOptions.LongRunning, // guarantees separate thread
                        TaskScheduler.Default)
                    .Wait();

                var customData = streamProvider.CustomData;

这里我使用 MultiStreamProvider 来获取文件，这是该提供者的核心

  public override Task ExecutePostProcessingAsync()
    {
        foreach (var file in Contents)
        {
            var parameters = file.Headers.ContentDisposition.Parameters;
            var filename = GetNameHeaderValue(parameters, "filename");
            var year = GetNameHeaderValue(parameters, "year");
        }

        return base.ExecutePostProcessingAsync();
    }

我能够毫无问题地获得文件名，但永远无法获得年份。这是我查看参数变量时调试器中的值

如您所见，名称是“name”，值是“year”，而我希望名称是“year”，值是“2016”或我传入的任何值。我在做什么这里错了，我如何获取包含在对 Api 的同一次调用中的元数据？

【问题讨论】：

标签： angularjs asp.net-web-api http-post ng-file-upload

【解决方案1】：

我们对 ng-file-upload 和 WebAPI 使用类似的方法。要从表单数据中获取值，我们无法使用 GetNameHeaderValue。我们不得不做一些手动解析。我们决定使用http://conficient.wordpress.com/2013/07/22/async-file-uploads-with-mvc-webapi-and-bootstrap/ 上发布的内容的修改版本来动态获取表单并将其卸载到强类型模型。但基本上，这是它在 ExecutePostProcessingAsync 方法中的作用：

public override async Task ExecutePostProcessingAsync()
{
  var formData = new FormCollection();
  for (int index = 0; index < Contents.Count; index++)
  {
     ContentDispositionHeaderValue contentDisposition = headers.ContentDisposition;
     if (contentDisposition != null)
     {
       HttpContent formContent = Contents[index];
       string formFieldName = UnquoteToken(contentDisposition.Name) ?? String.Empty;

       // Read the contents as string data and add to form data
       string formFieldValue = await formContent.ReadAsStringAsync();
       formData.Add(formFieldName, formFieldValue);
     }

     //For your case
     var filename = formData["filename"];
     var year = formData["year"];

这是它使用的 UnquoteToken 方法：

private static string UnquoteToken(string token)
{
  if (String.IsNullOrWhiteSpace(token))
  {
    return token;
  }

  if (token.StartsWith("\"", StringComparison.Ordinal) && token.EndsWith("\"", StringComparison.Ordinal) && token.Length > 1)
  {
    return token.Substring(1, token.Length - 2);
  }

  return token;
}

【讨论】：