HTTP_INTERCEPTORS 的 multi: true 属性是什么意思？

Question

我是 Angular 的新手，我刚刚构建了一个拦截器。根据多个教程，您必须像这样在 app.module 中包含 HTTP_INTERCEPTORS：

providers: [{ provide: HTTP_INTERCEPTORS, useClass: MyInterceptor, multi: true }]

我想知道 multi: true 属性是什么 means/does 以及它是否可以省略。

我已阅读 angular.io 关于此属性的指南。他们解释如下：

我不明白这部分：

Note the multi: true option. This required setting tells Angular that HTTP_INTERCEPTORS is a token for a multiprovider that injects an array of values, rather than a single value.

这阐明了这个概念，但我还不太明白拦截器何时注入多个值，何时不注入。例如，我自己的拦截器只更改 headers。这是否意味着它只注入一个值？

这是我的拦截器

import { Injectable } from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { LoginService } from '../Services/login.service';


@Injectable()
export class JwtInterceptor implements HttpInterceptor {

    constructor(private loginService:LoginService){}

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        // add authorization header with jwt token if available
        console.log("ik zit nu in de interceptor");
        let currentUser = this.loginService.getToken();
        if (currentUser !=="") {

            request = request.clone({
                headers: new HttpHeaders({
                    'Content-Type': 'application/json', 
                    'Authorization': `Bearer ${currentUser}`
                })
            });
        }
        return next.handle(request);
    }
}

这是app.module

的提供列表

  providers: [
    { provide: APP_BASE_HREF, useValue: '/' },
    { provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true },
    { provide: 'AUTH_URL', useValue: 'http://localhost:8080/auth' },
    { provide: 'API_URL', useValue: 'http://localhost:8080/api' },
    { provide: 'HEADERS', useValue: new HttpHeaders({'Content-Type': 'application/json'}) },
    LoginGuard,
    LoginService,
    UserService,
    MessageService
  ],

Answer 1

从 ValueProvider 接口的描述我们可以读到 multi 属性:

When true, injector returns an array of instances. This is useful to allow multiple providers to spread across many files to provide configuration information to a common token.

这意味着对于我们提供一个值的令牌，将使用多个值（或 class）。

例如，参见this example（_{^{这是一个示例项目}}）其中指定了令牌HTTP_INTERCEPTORS 使用 classes (useClass) ErrorInterceptor 和 SecurityInterceptor。为了让它工作，我们需要指定 multi: true 以便 Angular 知道将使用多个值（或 classes）。

{
  provide: HTTP_INTERCEPTORS,
  useClass: ErrorInterceptor,
  multi: true
},
{
  provide: HTTP_INTERCEPTORS,
  useClass: SecurityInterceptor,
  multi: true
},

这里的一个关键点是 HTTP_INTERCEPTORS 是一个 multi-provider 令牌。这意味着当为此令牌提供新值或 class 时，需要属性 multi 并且必须将其设置为 true.

参见 HttpClient documentation when it is described how to provide an interceptor 中声明的部分：

Note the multi: true option. This required setting tells Angular that HTTP_INTERCEPTORS is a token for a multiprovider that injects an array of values, rather than a single value.

HTTP_INTERCEPTORS 的 multi: true 属性是什么意思？

what does the multi: true attribute of HTTP_INTERCEPTORS mean?

angular-http-interceptors

angular

angular5