无法将文件发布到/ upload

时间:2019-11-19 23:46:05

标签: javascript angular typescript strapi

我正在尝试上传文件。我已经将其保存到服务器,并且可以看到它。我要发布的代码是

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中的标题,我发送的是:

enter image description here

任何指针都将得到很好的接收。

2 个答案:

答案 0 :(得分:4)

尝试替换

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

使用

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

->复数而不是单数。据我了解,stradi api(或上载插件?)期望数据位于名为“文件”的字段中。

我奋斗了几个小时,直到读了帕夫洛·拉祖莫夫斯基(Pavlo Razumovskyi)的评论here

现在是新API,请检查新文档: trapi.io/documentation/3.0.0-beta.x/plugins/… formData.append('files.MODEL_FILE_FIELD_NAME',blob,文件名)

那至少对我来说解决了!

答案 1 :(得分:0)

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

.html文件中的.HMTL文件中的

这样做

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

您可以在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)
{

}

这应该有效