Angular 9 HttpClient:忽略一次调用的标头 [英] Angular 9 HttpClient: Ignore header on one call

查看:85
本文介绍了Angular 9 HttpClient:忽略一次调用的标头的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试使用Angular 9中的HttpClient向Google图书api发出请求.我想在单个get请求中禁用Authorization标头 .

I am trying to make requests to the google books api using HttpClient in Angular 9. I want to disable the Authorization header in a single get request.

我的问题是我已经登录并且我的请求具有一个Authorization标头,该标头会导致对google books API的调用返回401错误.我也可以在邮递员中复制相同的内容.在请求调用中添加一个key参数(我在其中传递API密钥)没什么区别.

My problem is that I am already logged in and my requests have an Authorization header which causes calls to the google books API to return a 401 error. I can replicate the same in postman as well. Adding a key parameter to the request call (where I pass my API key) makes no difference.

在禁用Authorization标头的情况下,我得到200状态代码:

With Authorization header disabled I get a 200 status code:

启用了Authorization标头后,我会得到401状态代码:

With Authorization header enabled I get a 401 status code:

最后,我在浏览器中的请求:

And finally, my request in the browser:

这是我将授权"标头添加到httpClient的位置:

This is where I add my Authorization header to httpClient:

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const currentUser = this.localStorageService.getCurrentUser();
    if (currentUser) {
      request = request.clone({
        setHeaders: {
          Authorization: `Bearer ${currentUser.split('"')[3]}`
        }
      });
    }
    return next.handle(request);
  }

最后,我在其中注入httpClient和调用的构造函数:

And finally, the constructor where I inject httpClient and the call:

  constructor(public httpClient: HttpClient) {
  }

  public requestBook(isbn: string): Observable<any> {
    return this.httpClient.get(`https://www.googleapis.com/books/v1/volumes?q=${isbn}`);
  }

我的问题是:我想在requestBook中的get Request中禁用Authorization标头,但将其保留在其他位置.我以为我会创建一个新的httpClient实例,但是它也有授权标头.

My question is: I want to disable the Authorization header in the get Request in requestBook but keep it anywhere else. I thought I'd create a new httpClient instance but that also had the Authorization Header.

推荐答案

我反对在Angular项目中使用拦截器来处理HTTP请求,除非它是绝对必要的,并且不会在不同的资源请求或端点之间进行更改.

I am against using interceptor to manipulate HTTP request in an Angular project unless it's absolutely essential and won't be changed across different resources requests or endpoints.

在您的情况下,显然不是这样,因为您希望在一个特定请求中删除Authorization标头.

In your case, it's obviously not the case because you want Authorization header to be removed in one specific request.

当然,您可以做一些愚蠢的调整来快速使它工作,例如

Of course, you can do some silly tweaks to quickly make it work such as

if (currentUser && !request.url.includes('www.googleapis.com/books/v1/volumes')) {
  request = request.clone({
    setHeaders: {
      Authorization: `Bearer ${currentUser.split('"')[3]}`
    }
  });
}

但是我建议您创建自己的有角度的服务,而不要使用拦截器来操纵全局请求.

But I would recommend create your own angular Service instead of manipulating global requests with the interceptor.

因此,基本上,您现在调用 this.myApiService.get()而不是简单地包装 HttpClient 服务以及一些其他适合您需求的业务逻辑.

So basically instead of calling this.httpClient.get(), you now calling this.myApiService.get() instead which simply wrap a HttpClient service with some additional business logic that suit your needs.

然后,当您想要禁用发送Authorization标头时,请在您自己的方法中使用此标志,并使用如下所示的标志:

Then when you want to disable sending Authorization header, have this flag in your own method and use it something like this:

this.myApiService.get('my-resource', { noAuth: true });

与有时会使您的同事发疯的Blackbox拦截器相比,此方法更易于维护.

This is more maintainable compare to Blackbox interceptor that sometimes drive your colleagues crazy.

这篇关于Angular 9 HttpClient:忽略一次调用的标头的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆