Angular中的Post方法返回400BadRequest错误
- 首先，确保你的API可以接受Post请求，并且请求的参数格式正确。如果请求的参数格式不正确，服务器会返回400 Bad Request错误。
- 使用Chrome浏览器的开发者工具或类似工具调试代码，检查发送的请求的头部信息是否正确。例如，Content-Type应该设置为application/json，请求体应该是一个有效的JSON字符串。
- 确保数据发送失败后代码也有对异常情况的处理，可以使用catch方法并打印错误信息进行调试。
- 如果API使用了身份验证，确保你的请求已经通过身份验证并添加正确的授权头部信息。 以下是一个简单的示例代码，可能会有所帮助。
service.ts文件：
import { Injectable } from '@angular/core'; import { HttpClient, HttpErrorResponse } from '@angular/common/http'; import { throwError } from 'rxjs'; import { catchError } from 'rxjs/operators';
@Injectable({ providedIn: 'root' }) export class ApiService {
private apiURL = 'http://localhost:3000';
constructor(private http: HttpClient) { }
handleError(error: HttpErrorResponse) {
if (error.error instanceof ErrorEvent) {
console.error('An error occurred:', error.error.message);
} else {
console.error(
Backend returned code ${error.status}, +
body was: ${error.error});
}
return throwError(
'Something bad happened; please try again later.');
};
//以下是一个发出POST请求的方法
postData(data) {
return this.http.post(${this.apiURL}/myData, data)
.pipe(
catchError(this.handleError)
)
}
}
component.ts文件：
import { Component } from '@angular/core'; import { ApiService } from './api.service';
@Component({
selector: 'app-root',
template: ,
})
export class AppComponent {Post Data to API
title = 'app'; myData = {name: 'John', age: 30};