在 angular 中发布文件

Question

我正在尝试 post angular 5 中上传的文件到 c# 控制器。当我调试我的应用程序和 post 并点击控制器时，[FromBody] IFormFile 文件始终为 null

我需要从我的 angular 服务传递他们的特定 {responseType} 吗？

Angular 服务

public async upload(file: File) {
  try {
    return await this.http.post(this.baseUrl + "api/Blogs/Upload", file).toPromise();
  catch (error) {
    console.log(JSON.stringify(error));
  }
}

C# 控制器

[HttpPost]
[Route("api/Blogs/Uplaod")]
public async Task<IActionResult> Upload([FromBody] IFormFile file) {
  // my save logic
}

为什么我的 Post Body 总是空的？

Answer 1

您不能只在 Angular 中的 post 请求正文中传递文件。您必须将其作为 formData

发送

uploadFile(file: File) {
  var formData: FormData = new FormData();
  formData.append('file', file, file.name);

  var headers = new HttpHeaders().set('Accept', 'application/json');
  var options = { headers: headers };

  const req = new HttpRequest('POST', this.baseUrl + "api/Blogs/Upload", formData, options);
  return this.http.request(req);
}

然后在您的控制器中，像这样获取文件

[HttpPost]
[Route("api/Blogs/Upload")]
public async Task<IActionResult> Upload() {
  var myFile = HttpContext.Current.Request.Files(0)
  // you can append more than 1 file in angular, but if you know its only ever 1 file, you can just get the `Files(0)` at that index of zero.
  // my save logic
}

在 angular 中发布文件

posting File in angular

c#

angular

file

.net-core

iformfile