从角度到弹簧的表格数据发布请求

Question

我正在尝试使用angular和它的http库向我的spring rest api发送一个帖子请求。

目前在post-man（成功）我以这种方式发送数据：

1. 格式是表单数据
2. 关键是reqData（必填）
3. 价值是json（强制性）

如何通过角度以相同的方式发送数据？

目前，这是我的数据的样子：

onSignIn(form: NgForm) {
    const email = form.value.email;
    const password = form.value.password;

    const reqData = {
      'app_uname': email,
      'app_pass': password
    };
}

添加更多关于我的后端代码：

我的休息api看起来像这样：

@RequestMapping(value = "/login", method = RequestMethod.POST)

@ResponseBody
public ResponseEntity<String> handle(@RequestParam(value = "reqData") String reqData,HttpServletRequest request)

所以我应该发送一个键和值（我不知道打字稿中的哪个数据结构，但在java中它是MultiValueMap），其中键是reqData，值应该是字符串或json对象中的json。

如何使我的reqData json在角度为MultiValueMap格式？

我也尝试过formData和Map：

const formData: FormData = new FormData();
    formData.append('reqData', JSON.stringify(reqData));

const map = new Map();
    map.set('reqData', reqData);

Answer 1

使用formdata使用发送数据到服务器可以这样做

const email = form.value.email;
const password = form.value.password;

const formData: FormData = new FormData();
formData.append("email ", email);
formData.append("password ", password);

// then http post to server

编辑

如果你想以json的形式提交数据，你需要这样做

const email = form.value.email;
const password = form.value.password;

const reqData = {
  'app_uname': email,
  'app_pass': password
};

const formData: FormData = new FormData();
formData.append("reqData", JSON.stringify(reqData));

// then http post to server and in the server you need to parse the json string

希望它能解决你的问题。 如果这可以解决您的问题，请告诉我

Answer 2

您可以创建一个发布方法，如下所示：

var model = {email: youremail, password: yourpassword};
post(url: string, model: any): Observable <any> {
    let formData: FormData = new FormData(); 
    formData.append('app_uname', model.email); 
    formData.append('app_pass', model.password); 
    return this._http.post(url, formData)
        .map((response: Response) => {
            return response;
        }).catch(this.handleError); 
}

Answer 3

这就是我向后端发送请求所做的工作。

我创建了所需的json，然后我创建了一个请求参数字符串

const reqData = 'reqData=' + jsonDataInString;

发送了成功请求。