发送 Angular Post 调用时，Spring 中缺少所需的请求正文答案

【问题标题】：Required request body is missing in Spring when Angular Post call is sent发送 Angular Post 调用时，Spring 中缺少所需的请求正文
【发布时间】：2020-02-20 17:58:45
【问题描述】：

在我的 Angular 应用程序中，我尝试创建一个带有 json 正文的 POST 请求，该请求将发送到我的 Spring Restful 后端；我在 Angular 中创建了一个服务来处理 API Post 方法，但是当我尝试发送请求时，我在前端控制台中收到此错误：

core.js:6014 ERROR HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: "http://127.0.0.1:8080/center/search_1/page/0", ok: false, …}

我的后端控制台中出现此错误：

Required request body is missing: public org.springframework.data.domain.Page

这是我在 Angular 中的服务代码：

import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http';
import {FirstQuery} from '../../../_responseModels/firstQuery/first-query';
import {tap} from 'rxjs/operators';
import {stringify} from 'querystring';

@Injectable({
  providedIn: 'root'
})
export class ApiCenterSearch1Service {

  apiURL = 'http://127.0.0.1:8080/center/search_1/page/0';

  constructor(private httpClient: HttpClient) {}

  getFirstQuery(body: JSON): any {

    return  this.httpClient.post<FirstQuery[]>(this.apiURL, JSON.stringify(body),
      {
        headers : new HttpHeaders({'Content-Type': 'application/json'})
        // observe: 'response'
      });
  }

}

这是触发 API 调用的组件代码的一部分：

funcThis.apiCenterSearch1Service.getFirstQuery(JSON.parse(jsonRequest)).subscribe(
              res => {
                console.log(res);
              });

我已经通过 Insomnia（一个 API 测试器应用程序）测试了我的 Spring API，它可以正常工作（我还检查了后端所需的 JSON 格式是否正确，所以我不认为问题是这个）。

我哪里做错了？

【问题讨论】：

标签： angular spring

【解决方案1】：

请尝试以下代码

import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http';
import {FirstQuery} from '../../../_responseModels/firstQuery/first-query';
import {tap} from 'rxjs/operators';
import {stringify} from 'querystring';

@Injectable({
  providedIn: 'root'
})
export class ApiCenterSearch1Service {

  apiURL = 'http://127.0.0.1:8080/center/search_1/page/0';

  constructor(private httpClient: HttpClient) {}

  getFirstQuery(body: any): any {

    return  this.httpClient.post<FirstQuery[]>(this.apiURL, body,
      {
        headers : new HttpHeaders({'Content-Type': 'application/json'})
        // observe: 'response'
      });
  }

}

你的服务代码应该是这样的

this.apiCenterSearch1Service.getFirstQuery(jsonRequest).subscribe(
          res => {
            console.log(res);
          });

【讨论】：

【解决方案2】：

将您的代码修改为此代码。问题可能是您的后端想要一个 json 对象，但您正在发送一个字符串。

import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http';
import {FirstQuery} from '../../../_responseModels/firstQuery/first-query';
import {tap} from 'rxjs/operators';
import {stringify} from 'querystring';

@Injectable({
  providedIn: 'root'
})
export class ApiCenterSearch1Service {

  apiURL = 'http://127.0.0.1:8080/center/search_1/page/0';

  constructor(private httpClient: HttpClient) {}

  getFirstQuery(body: Object): any {

    return  this.httpClient.post<FirstQuery[]>(this.apiURL, body,
      {
        headers : new HttpHeaders({'Content-Type': 'application/json'})
        // observe: 'response'
      });
  }

}

服务

funcThis.apiCenterSearch1Service.getFirstQuery(jsonRequest).subscribe(
  res => {
    console.log(res);
  });

【讨论】：

【解决方案3】：

我已经完全解决了这个问题，在我的后端应用程序的所有 API 入口点中添加了 @CrossOrigin 注释以启用 CORS 策略；所以不是前端问题

【讨论】：