Как отправить из Angular 5 через POST на контроллер Spring несколько RequestParams
У меня есть этот Spring Controller:
@RequestMapping(value = "/create")
@ResponseBody
public ResponseEntity<?> create(
@RequestParam String name,
@RequestParam Integer startYear,
@RequestParam Integer endYear,
@RequestParam(required=false) MultipartFile polygons,
@RequestParam(required=false) Long reference
)
Можно ли отправить эти параметры из Angular через запрос POST?
Я пробую это:
public createExperiment(): Observable<any> {
const headers = new HttpHeaders({'Content-Type': 'application/json'});
return this.http.post(this.backUrl + 'puerto/create', {name:'name'}, {headers: headers})
.map((res: any) =>
res
);
}
Но я уже получаю эту ошибку:
error : {timestamp: 1527665099011, status: 400, error: "Bad Request", exception: "org.springframework.web.bind.MissingServletRequestParameterException", message: "Required String parameter 'name' is not present", …}
Почему я получаю эту ошибку? и если я это исправлю, могу ли я также отправить MultiPartFile?
Я знаю, что могу исправить это, изменив контроллер и получив параметры через ResquestBody, но я хотел бы отправить параметры отдельно.
Ответы 2
@RequestParam используется, когда у вас есть параметры URL.
http.post(url, null, { headers: headers, params: new HttpParams().set('name', 'fer') })
Это отправит имя вместе с URL-адресом, например http://abcd.com/a/b?name=fer
Если вы хотите отправить его как тело сообщения, определите модель в коде Spring и используйте аннотацию @RequestBody в контроллере Spring.
Посмотрите пример здесь.
Он работал с использованием formData и ('Content-Type', 'multipart / form-data');
public createExperimentService(formData: FormData): Observable<any> {
const headers = new HttpHeaders();
headers.append('Content-Type', 'multipart/form-data');
return this.http.post(this.backUrl + 'puerto/create', formData, {headers: headers})
.map((res: any) =>
res
);
}
formData: FormData = new FormData();
createExperiment() {
this.formData.append('name', this.nameExperiment);
this.formData.append('startYear', this.startYear);
this.formData.append('endYear', this.endYear);
this.formData.append('reference', this.reference);
this.createExperimentService(this.formData).subscribe(res => {
console.info(res);
});
}
//This method loads a file
fileChange(event) {
const fileList: FileList = event.target.files;
if (fileList.length > 0) {
const file: File = fileList[0];
this.formData.append('polygons', file, file.name);
}
}