如何使用 Angular 4.3 HttpClient 在發布請求的正文中發布字符串？

Question

我們有一個 .net WebAPI，它在 post 請求的正文中查找文件路徑字符串並返回相應的圖像。 我正在努力使用新的 httpClient 從 Angular 4.3 成功地將字符串傳遞給它。 有可能嗎？ 端點正在被其他東西使用，所以我真的不想創建一個......一個字符串的“模型”，這樣我就可以基本上復制它，但如果可能的話，將它傳遞給 json。

WebAPI 方法簽名：

public HttpResponseMessage ImagesFromPaths(HttpRequestMessage request, [FromBody] string path)

當前服務方式：

getImage(path: string): Observable<any> {

  return this.http.post(
    `${apiUrl}`,
    { path },
    { headers: new HttpHeaders({
      'Content-Type': 'application/json',
    }), responseType: 'blob',
  })
}

必須是一件容易實現的事情嗎？

Answer 1

您的代碼幾乎具有所有優點。 主要問題是Content-Type標頭。 如果您想使用[FromBody]注釋將字符串發送到.NET REST API 並使用application/json標頭值，您應該將""添加到您的路徑參數中，例如"test_value" ：

return this.http.post(
  `${apiUrl}`,
    `\"${path}\"` ,
  { headers: new HttpHeaders({
    'Content-Type': 'application/json',
  }), responseType: 'blob',
  })

您還可以使用x-www-form-urlencoded標頭值。 然后您必須以這種方式將您的參數傳遞給請求正文：

return this.http.post(
  `${apiUrl}`,
    `=${path}` ,
  { headers: new HttpHeaders({
    'Content-Type': 'application/x-www-form-urlencoded',
  }), responseType: 'blob',
  })

Answer 2

您可以通過刪除[fromBody]屬性從query獲取path

public HttpResponseMessage ImagesFromPaths(HttpRequestMessage request, string path)

而在郵寄路徑post請求${apiUrl}/${path}

return this.http.post(
  `${apiUrl}/${path}`,
  { headers: new HttpHeaders({
    'Content-Type': 'application/json',
  }), responseType: 'blob',
  })

Answer 3

我只是通過這個選項嘗試了另一種替代方法，並將字符串路徑 Json 定向到 post 方法的主體。

 getImage(path: string) {
            let headers = new Headers({ 'Content-Type': 'application/json' });
            let options = new RequestOptions({ headers: headers });

            return new Promise((resolve, reject) => {
                this.http.post('${apiUrl}',path, options)
                .map((res) => res.json()).share()
                .subscribe(res => {
                  resolve(res)
                }, (err) => {
                  reject(err);
                });
            });
          }

如果它有效，我會很高興。謝謝