angular - angular 4 typescript 中的文件上传和下载

Question

如何从 Angular 4 下载(位于根路径中的 .exe 文件)并上传文件？
我是 Angular4、typescript 和 .NET Core Web API 的新手。

我用谷歌搜索了这个但找不到解决方案。

以下是我发现的一些类似问题:

• Uploading file to controller using typescript

• Returning binary file from controller in ASP.NET Web API

Answer 1

我想为此添加一个 Angular 4.3/5/6/7/8 更新，尤其是相对于简化的 HttpClient。缺少“Content-Type”尤为重要，因为 Angular 会自动构建 Content-Type(有添加 Content-Type=undefined 的倾向。不要这样做，因为它会在各种情况下产生问题，也许不会好的做法)。一旦没有 Content-Type，浏览器会自动添加 'multipart/form-data' 和相关参数。请注意，这里的后端是 Spring Boot，尽管这无关紧要。

这是一些伪代码——请原谅手指粗大。希望这有助于:

MyFileUploadComponent(.html):

...
<input type="file" (change)=fileEvent($event)...>

MyFileUploadComponent(.ts) 在 fileEvent 上调用 MyFileUploadService(.ts):

...
public fileEvent($event) {
   const fileSelected: File = $event.target.files[0];
   this.myFileUploadService.uploadFile(fileSelected)
   .subscribe( (response) => {
      console.log('set any success actions...');
      return response;
    },
     (error) => {
       console.log('set any error actions...');
     });
}

MyFileUploadService.ts:

...
public uploadFile(fileToUpload: File) {
  const _formData = new FormData();
  _formData.append('file', fileToUpload, fileToUpload.name);   
  return<any>post(UrlFileUpload, _formData); 
  //note: no HttpHeaders passed as 3rd param to POST!
  //So no Content-Type constructed manually.
  //Angular 4.x-6.x does it automatically.
}