无法在 Spring Boot 中调用 put 端点
Can't invoke the put endpoint in Springboot
我有来自前端的这段代码 (Angular)
private _baseUrl = "http://localhost:8080/api/v1/professor/";
getProfessor(id: string): Observable<Professor> {
const professor = this.http.get<Professor>(this._baseUrl + id);
return professor;
}
addProfessorRating(id: string, rating: Object): void {
// get the professor, then modify the ratings of them, and make a put request
this.getProfessor(id).subscribe(professor => {
let ratings = professor['ratings'];
ratings.push(rating);
professor['ratings'] = ratings;
return this.http.put<void>(this._baseUrl + id, professor, {
headers: new HttpHeaders({
'content-type': 'application/json'
})
})
});
}
来自后端的端点(Spring 启动):
@PutMapping(path = "/{id}")
public String updateProf(@PathVariable("id") String id, @Valid @NotNull @RequestBody Professor professor) {
logger.info("updating professor");
professorService.updateProfessor(id, professor);
return "Updated professor with id: " + id;
}
但是,端点未调用,因为记录器未在控制台中记录任何内容。我尝试使用 Postman,它确实调用了端点。我做错了什么吗,如果这个 post 不够具体,我也会提供任何信息。
更新:我通过 Angular 表单中的 onSubmit 函数调用了 addProfessorRating:
onSubmit(rating: Object) {
const id = this.route.snapshot.paramMap.get('id');
this.professorService.addProfessorRating(id, rating);
}
如有任何帮助,我将不胜感激。
您需要使用 RxJS 高阶映射运算符(例如 switchMap
)从一个可观察对象(this.getProfessor()
)映射到另一个(this.http.put()
)。
尝试以下方法
private _baseUrl = "http://localhost:8080/api/v1/professor/";
addProfessorRating(id: string, rating: Object): void {
this.getProfessor(id).pipe( // get the professor, then modify the ratings of them, and make a put request
switchMap(professor => {
let ratings = professor['ratings'];
ratings.push(rating);
professor['ratings'] = ratings;
return this.http.put < void > (this._baseUrl + id, professor, {
headers: new HttpHeaders({
'content-type': 'application/json'
})
});
})
).subscribe(
res => console.log(res),
err => console.log(err)
);
}
好的做法是 return 从所有函数中观察到并在基本函数中订阅它。这允许您保留调用的异步性质并使用来自可观察对象的发射值。
addProfessorRating(id: string, rating: Object): Observable<any> { // <-- return the observable
return this.getProfessor(id).pipe( // get the professor, then modify the ratings of them, and make a put request
switchMap(professor => {
let ratings = professor['ratings'];
ratings.push(rating);
professor['ratings'] = ratings;
return this.http.put < void > (this._baseUrl + id, professor, {
headers: new HttpHeaders({
'content-type': 'application/json'
})
});
})
); // <-- don't subscribe yet
}
onSubmit(rating: Object) {
const id = this.route.snapshot.paramMap.get('id');
this.professorService.addProfessorRating(id, rating).subscribe( // <-- subscribe here
res => {
console.log(res);
// other statements that depend on `res`
},
err => {
// also good practice to handle error notifications from HTTP observables
}
);
}
其他类型的 RxJS 高阶映射运算符是 mergeMap
、concatMap
和 exhaustMap
。您可以找到它们之间的简要区别 .
我有来自前端的这段代码 (Angular)
private _baseUrl = "http://localhost:8080/api/v1/professor/";
getProfessor(id: string): Observable<Professor> {
const professor = this.http.get<Professor>(this._baseUrl + id);
return professor;
}
addProfessorRating(id: string, rating: Object): void {
// get the professor, then modify the ratings of them, and make a put request
this.getProfessor(id).subscribe(professor => {
let ratings = professor['ratings'];
ratings.push(rating);
professor['ratings'] = ratings;
return this.http.put<void>(this._baseUrl + id, professor, {
headers: new HttpHeaders({
'content-type': 'application/json'
})
})
});
}
来自后端的端点(Spring 启动):
@PutMapping(path = "/{id}")
public String updateProf(@PathVariable("id") String id, @Valid @NotNull @RequestBody Professor professor) {
logger.info("updating professor");
professorService.updateProfessor(id, professor);
return "Updated professor with id: " + id;
}
但是,端点未调用,因为记录器未在控制台中记录任何内容。我尝试使用 Postman,它确实调用了端点。我做错了什么吗,如果这个 post 不够具体,我也会提供任何信息。
更新:我通过 Angular 表单中的 onSubmit 函数调用了 addProfessorRating:
onSubmit(rating: Object) {
const id = this.route.snapshot.paramMap.get('id');
this.professorService.addProfessorRating(id, rating);
}
如有任何帮助,我将不胜感激。
您需要使用 RxJS 高阶映射运算符(例如 switchMap
)从一个可观察对象(this.getProfessor()
)映射到另一个(this.http.put()
)。
尝试以下方法
private _baseUrl = "http://localhost:8080/api/v1/professor/";
addProfessorRating(id: string, rating: Object): void {
this.getProfessor(id).pipe( // get the professor, then modify the ratings of them, and make a put request
switchMap(professor => {
let ratings = professor['ratings'];
ratings.push(rating);
professor['ratings'] = ratings;
return this.http.put < void > (this._baseUrl + id, professor, {
headers: new HttpHeaders({
'content-type': 'application/json'
})
});
})
).subscribe(
res => console.log(res),
err => console.log(err)
);
}
好的做法是 return 从所有函数中观察到并在基本函数中订阅它。这允许您保留调用的异步性质并使用来自可观察对象的发射值。
addProfessorRating(id: string, rating: Object): Observable<any> { // <-- return the observable
return this.getProfessor(id).pipe( // get the professor, then modify the ratings of them, and make a put request
switchMap(professor => {
let ratings = professor['ratings'];
ratings.push(rating);
professor['ratings'] = ratings;
return this.http.put < void > (this._baseUrl + id, professor, {
headers: new HttpHeaders({
'content-type': 'application/json'
})
});
})
); // <-- don't subscribe yet
}
onSubmit(rating: Object) {
const id = this.route.snapshot.paramMap.get('id');
this.professorService.addProfessorRating(id, rating).subscribe( // <-- subscribe here
res => {
console.log(res);
// other statements that depend on `res`
},
err => {
// also good practice to handle error notifications from HTTP observables
}
);
}
其他类型的 RxJS 高阶映射运算符是 mergeMap
、concatMap
和 exhaustMap
。您可以找到它们之间的简要区别