如何在 Angular 4 的 http 请求中添加基本身份验证

Question

我没有尝试过任何我所拥有的只是 http post 方法，我需要将用户名和密码作为基本身份验证传递给我正在访问的每个 API

onSubmit = function(userdata){
     this.tokenkey = localStorage.getItem('logintoken');

  console.log(JSON.stringify(userdata));
this.pass=
{
  "foodid": userdata.foodid,
  "foodname": userdata.foodname,
  "state" : userdata.state,
  "station" : userdata.station,
  "district" : userdata.district,
  "zipcode" : userdata.zipcode,
  "country" : userdata.country,
  "description" : userdata.description,

}
 this.http.post(SERVER_URL+'fooddata/add',this.pass).subscribe((Response) => {
   console.log(Response);
 if(Response.ok === true){
    this.Success();
    this.temp = {};
    this.userdata.reset();
  }
 else this.Error();
})

}

有关如何在此 API 中传递身份验证标头的任何帮助？

Answer 1

您可以创建一个拦截器，将身份验证标头键值对添加到您发出的每个请求中。 这种任务是 Http 拦截器的完美候选。 检查此页面和此页面。

下面是一个例子：

@Injectable({
    providedIn: 'root',
})
export class CustomInterceptor implements HttpInterceptor {
    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        let params = req.params.set('custom-header-name', 'custom-header-value');
        return next.handle(req.clone( { params } ));
    }
}

现在，在您导入HttpClientModule或任何其他模块的模块中提供此拦截器：

providers: [{provide: HTTP_INTERCEPTORS, useClass: CustomInterceptor}]