如何使用角度将文件发送到asp.net web api？答案

【问题标题】：How to send a file to asp.net web api with angular?如何使用角度将文件发送到asp.net web api？
【发布时间】：2016-07-23 13:47:11
【问题描述】：

基本上我想要的是将文件发送到 mi web api，然后将其上传到 azure。当我选择文件时会触发此代码，但我不确定它是否正确。

$scope.fileNameChanged = function(files)
{
    var formD = new FormData();
    var reader = new FileReader();
    reader.onload = function(e)
    {
        $scope.$apply(function()
       {
          $scope.files = reader.result;      
       });
     
    };
    formD.append("file",files.files[0]);
    reader.readAsText(files.files[0]);

    $http({

    method: 'POST',
    headers: {'Content-Type': undefined},
    data:{formD},
    transformRequest : angular.identity,
    url: 'http://localhost:12199/api/FacturacionWeb/PostFormData'
     
    }).success(function(data)
    { 
      
    }).then(function(dat)
      {
        
      })
     
}

<input type="file" multiple onchange="angular.element(this).scope().fileNameChanged(this)">
    <div>Import file...</div>

     <div>
  <textarea ng-model="files" accept=".txt" readonly="true" style="width:99%; height:500px" disabled></textarea>

ASP.NET C# 代码（后端） 这段代码是我在后端得到的，但总是得到“UnsupportedMediaType” 我不知道问题是角度还是asp请帮帮我！！

   public async Task<HttpResponseMessage> PostFormData(HttpRequestMessage request)
    {
        // Check if the request contains multipart/form-data.
        if (!Request.Content.IsMimeMultipartContent())
        {
            throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
        }

        string root = HttpContext.Current.Server.MapPath("~/App_Data");
        var provider = new MultipartFormDataStreamProvider(root);

        try
        {
            // Read the form data.
            await Request.Content.ReadAsMultipartAsync(provider);

            // This illustrates how to get the file names.
            foreach (MultipartFileData file in provider.FileData)
            {
                Trace.WriteLine(file.Headers.ContentDisposition.FileName);
                Trace.WriteLine("Server file path: " + file.LocalFileName);
            }
            return Request.CreateResponse(HttpStatusCode.OK);
        }
        catch (System.Exception e)
        {
            return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e);
        }
    }

【问题讨论】：

标签： c# asp.net angularjs file-upload

【解决方案1】：

您的 angularjs 代码很好。你需要更新你的 asp.net 代码，比如 as-

public async Task<HttpResponseMessage> PostFormData(HttpRequestMessage request)
    {
        // Check if the request contains multipart/form-data.
       if (!request.Content.IsMimeMultipartContent("form-data"))
            {
            throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
        }

        string root = HttpContext.Current.Server.MapPath("~/App_Data");
        var provider = new MultipartFormDataStreamProvider(root);

        try
        {
            // Read the form data.
            await Request.Content.ReadAsMultipartAsync(provider);

            // This illustrates how to get the file names.
            foreach (MultipartFileData file in provider.FileData)
            {
                Trace.WriteLine(file.Headers.ContentDisposition.FileName);
                Trace.WriteLine("Server file path: " + file.LocalFileName);
            }
            return Request.CreateResponse(HttpStatusCode.OK);
        }
        catch (System.Exception e)
        {
            return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e);
        }
    }

【讨论】：