如何使用angular将文件发送到asp.net Web API？

checo 发表于 Dev

捷克文

基本上我想要的是将文件发送到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);
        }
    }

谢兰德拉·辛格·多尔（Shailendra Singh Deol）

您的angularjs代码很好。您需要像这样更新您的asp.net代码-

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);
        }
    }

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。