如何使用http POST请求作为formData发送文件?

时间:2019-06-15 17:39:00

标签: angular swagger

我正在使用swagger 2.0记录我的API。我定义了一个资源/ getsize,如下面的代码片段所示:

    post:
      operationId: users.getSize
      tags:
        - Users
      summary: Measure your body
      description: import a photo
      consumes:
         - multipart/form-data
      parameters:
        - in: formData
          name: image1
          type: file
          required: true
        - in: path
          name: height
          type: number
          required: true

当我尝试从锯齿用户界面发送请求时,得到了预期的结果。但是,当我尝试使用Angluar组件访问此资源时,就会出现问题,这里是component.ts文件的代码片段:

onSubmit() {
    const formData = new FormData();
    formData.append('image1', this.image);
    console.log(formData.getAll);
    console.log(this.image);
    this.http.post(endpoint,formData);
    .subscribe(res => {
        console.log(res);
        alert('SUCCESS !!');
      })
}

服务器响应为:

error:
detail: "Missing formdata parameter 'image1'"
status: 400
title: "Bad Request"
type: "about:blank"

有什么建议吗?

1 个答案:

答案 0 :(得分:1)

  

您可以使用 URLSearchParams 作为请求的正文来执行此操作   和angular将自动将内容类型设置为   application / x-www-form-urlencoded并正确编码身体。

This post explained the answer in detail