Angular2文件上傳與WebApi

Question

Angular2我想上傳文件並保存文件在服務器上的文件夾，但我不能得到HttpContext.Current.Request.Files，它始終爲空。我的代碼
-UploadService.ts

postFileUpLoad(url: string, data: any): any { 
    let headers = new Headers(); 
    if (localStorage.getItem('localStorage') != null) { 
     headers.append('Content-Type', 'multipart/form-data') 
     headers.append('Authorization', "Bearer " + JSON.parse(localStorage.getItem('localStorage')).idToken); 
    } 
    this.slimLoadingBarService.startLoading(); 
    return this.http.post(url, data, { 
     headers: headers 
    }) 
     .toPromise() 
     .then(this.extractData) 
     .catch(this.handleError); 
} 

-upload文件組件

onChange(event) { 
let fileList: FileList = event.target.files; 
    if (fileList.length > 0) { 
     let file: File = fileList[0]; 
     let formData: FormData = new FormData(); 
     formData.append('uploadFile', file, file.name); 
     this.httpService.postFileUpLoad('http://localhost:3000/api/uploadFile', formData); 
    }} 

- HTML

<input type="file" id="btnUpload" value="Upload" name="FileUpLoad" (change)="onChange($event)" class="upload" /> 

- API服務上傳

[HttpPost] 
    [Route("uploadFile")] 
    public HttpResponseMessage UploadJsonFile() 
    { 
     HttpResponseMessage response = new HttpResponseMessage(); 
     var abc = Request.Properties.Values; 
     var httpRequest = HttpContext.Current.Request; 
     if (httpRequest.Files.Count > 0) 
     { 
      foreach (string file in httpRequest.Files) 
      { 
       var postedFile = httpRequest.Files[file]; 
       var filePath = HttpContext.Current.Server.MapPath("~/UploadFile/" + postedFile.FileName); 
       postedFile.SaveAs(filePath); 
      } 
     } 
     return response; 
    } 

請幫助我，非常感謝！

Answer 1

更改API方法如下圖所示：

[HttpPost] 
[Route("uploadFile")] 
public HttpResponseMessage UploadJsonFile() 
{ 
    HttpResponseMessage response = new HttpResponseMessage(); 
    var abc = Request.Properties.Values; 
    var httpRequest = HttpContext.Current.Request; 
    var fileCount = httpRequest.Files.Count; 
    if (httpRequest.Files.Count > 0) 
    { 
     for (int i=0; i< fileCount ; i++) 
     { 
      var postedFile = httpRequest.Files[i]; 
      var filePath = HttpContext.Current.Server.MapPath("~/UploadFile/" + postedFile.FileName); 
      postedFile.SaveAs(filePath); 
     } 
    } 
    return response; 
} 

您將得到該文件中 「postedFile」。

Answer 2

您必須刪除此行。

headers.append('Content-Type', 'multipart/form-data') 

然後它會工作。