Как отправить почтовый запрос из приложения angular к весне?

Question

Я пытаюсь отправить запрос порта с именем пользователя и паролем:

signUp(username, password): Observable<String> {
return this.http.post<String>("http://localhost:8080/signUp", {
  params: { username: username, password: password }
});
}

Службе Spring, которая использует этот метод:

@CrossOrigin(origins = "http://localhost:4200")
@RequestMapping(value="/signUp", method=RequestMethod.POST)
public ResponseEntity<String> signUp(@RequestParam ("username") String username, @RequestParam("password")  String password) throws IOException {
 //not important
 return new ResponseEntity<String>("Added successfully.", HttpStatus.OK);
}

Когда я отправляю его, в angular Я получаю ошибку http 400. В сервисе Spring я вижу это сообщение:

2020-03-13 19: 32: 38.486 WARN 13200 --- [nio-8080-exe c -3] .wsmsDefaultHandlerExceptionResolver: Resolved [org .springframework.web.bind. , Может кто-нибудь помочь мне решить это? Заранее спасибо.

Answer 1

Кажется, что есть путаница между @RequestBody и @RequestParam - это две совершенно разные вещи.

@ RequestBody Указывает, что API ожидает полезную нагрузку запроса

и

@ RequestParam ожидает, что один или несколько параметров будут переданы в URL-адрес API при его вызове.

Теперь сервер ожидает параметр запроса , который будет передан при его вызове. Например, /signUp/username=abc, поэтому из пользовательского интерфейса вам нужно передать эту пару ключ-значение, то есть

http.post<String>(`http://localhost:8080/signUp?username=${username}&password=${password}`)

400 неверных запросов возникает при передаче тела запроса вместо параметра запроса . Альтернативное решение состоит в том, чтобы изменить бэкэнд так, чтобы он принимал полезную нагрузку запроса - тогда вам нужно будет использовать @RequestBody.

Answer 2

Возможным решением может быть этот запрос:

signUp(username, password): Observable<String> {
    return this.http.post<String>("http://localhost:8080/signUp", {
          username: username, password: password
    });
}

... с классом для тела запроса в вашем бэкэнде:

public class SignUp {
    private String username;
    private String password;
    // constructor, getters and setters or lombok @Data
}

... и затем в вашем контроллер:

@RequestMapping(value="/signUp", method=RequestMethod.POST)
public ResponseEntity<String> signUp(@RequestBody SignUp signUp) {
    // signUp.getUsername()...
    return new ResponseEntity<String>("Added successfully.", HttpStatus.OK);
}