无法将文件 POST 到 /upload答案

【问题标题】：Unable to POST file to /upload无法将文件 POST 到 /upload
【发布时间】：2019-11-19 23:46:05
【问题描述】：

我正在尝试上传文件。我已经把它放到服务器上，我可以看到它。我用来发布的代码是

postTheFileToStrapi2(file: File) {
    const formData: FormData = new FormData();
    console.log(file[0].name);
    formData.append('file', file[0]);
    this.http.post('http://localhost:1337/upload', formData)
      .subscribe((response) => console.log(response));
  }

问题是，我得到一个错误：

{
"statusCode":400,
"error":"Bad Request",
"message":[
   {"messages":[
      {"id":"Upload.status.empty","message":"Files are empty"}
   ]}]}

但是，查看 Chrome 中的标题，我发送了这个：

任何指针都会得到极大的欢迎。

【问题讨论】：

标签： javascript angular typescript strapi

【解决方案1】：

尝试替换

formData.append('file', file[0]);

与

formData.append('files', file[0]);

--> 复数而不是单数。据我了解，strapi api（或上传插件？）期望数据位于名为“files”的字段中。

我挣扎了好几个小时，直到我读到 Pavlo Razumovskyi 的评论 here:

现在是新的 api，请查看新文档： Strapi.io/documentation/3.0.0-beta.x/plugins/… formData.append('files.MODEL_FILE_FIELD_NAME', blob, 文件名)

至少为我解决了这个问题！

【讨论】：

【解决方案2】：

您可以按照以下示例在 Angular 中上传图片。

在您的 HTML 文件中的 .HMTL 文件中这样做

  <input class="hidden" type="file" (change)="readURL($event);" name="Uploadfile" 
   id="file" style="width: 100%;cursor: pointer;" #fileInput>

在 component.ts 文件中声明 fileInput 变量，如下所示

 @ViewChild('fileInput', { static: false }) fileInput: ElementRef;

你可以在component.ts中这样尝试

     uploadPhoto() {

       let userid = "43345;
      var nativeElement: HTMLInputElement = this.fileInput.nativeElement;
      var file = nativeElement.files[0];
      nativeElement.value = '';
      this.sampleService.ImageUpload(userid, file)
        .subscribe(photo => {
           
         ,
          err => {
           
            
          });
  }

在服务文件中如下所示

    ImageUpload(id, file) {
    var formData = new FormData();
    formData.append('file', file);
    return this.Http.post(this.url+ 'ImageUpload' + '/' + id, formData);
  }

在 WEB API 中执行以下代码以从 Angular 接收文件

[HttpPost("ImageUpload/{Id}")]
public async Task<IActionResult> plantFileUpload(string Id, [FromForm(Name = "file")] IFormFile file)
{

}

这应该可以工作

【讨论】：

试过了。它仍然有同样的错误。我不知道我在这方面出了什么问题。