Angular 帖子未按预期提供请求正文

Question

我的第一个单独的 Angular 应用程序...

我正在尝试发布到我的全新网络服务并使用以下代码：

  headers = new HttpHeaders(
    {'Content-Type':'text/plain'}
  );
  loginUrl = "http://localhost:8093/login";

  login(credentials): Observable<String> {
    const body = new HttpParams()
      .set('payload', 'testing...');

    let bodyValue = body.toString()
    return this.http.post<String>(this.loginUrl, body,{headers: this.headers})
  }

我的 Spring Boot 应用程序抛出异常，因为在它获取帖子时，请求中缺少有效负载参数。

我在我的 Firefox 浏览器中打开了 Web 开发者网络面板并看到以下视图：

起初，我认为这是我弹簧方面的错误配置，但我运行了一个 curl：

  curl --data "payload=testing" http://localhost:8093/login

这很好地进入了我的网络服务。因此，Angular 对我的参数进行编码的方式有所不同。

我找到了这个页面：https://github.com/angular/angular/issues/19535，但不确定它是否相关。

Answer 1

http.post 的第二个参数是内容正文。您可以通过这种方式传递 URL 参数：

const urlParams = new HttpParams()
  .set('payload', 'testing...');

 return this.http.post<String>(`${this.loginUrl}?${urlParams}`, '',{headers: this.headers});

如果你想将 url 参数传递到正文中，那么：

  login(credentials): Observable<String> {
    const body = new HttpParams()
      .set('payload', 'testing...');

    let bodyValue = body.toString()
    return this.http.post<String>(this.loginUrl, bodyValue,{headers: this.headers})
  }