如何使用http POST請求作為formData發送文件？

Question

我正在使用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

當我嘗試從sawgger ui發送請求時，得到了預期的結果。 但是，當我嘗試使用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"

有什么建議么 ？

Answer 1

您可以使用URLSearchParams作為請求的主體來執行此操作，angular會自動將內容類型設置為application / x-www-form-urlencoded並對主體進行正確編碼。

這篇文章詳細解釋了答案