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

问题描述

我是 Angular 的新手，我刚刚构建了一个拦截器.根据多个教程，您必须将 HTTP_INTERCEPTORS 包含在 app.module 中，如下所示:

I'm new to Angular and I've just built an interceptor. According to multiple tutorials you have to include the HTTP_INTERCEPTORS in the app.module like so:

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

我想知道 multi: true 属性的含义/作用以及它是否可以省略.

I was wondering what that multi: true attribute means/does and whether it can be omitted or not.

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

I've read the angular.io guide about this attribute. They explain it as following:

我不明白这部分:

注意 multi: true 选项.这个必需的设置告诉 AngularHTTP_INTERCEPTORS 是用于注入数组的多提供者的令牌值，而不是单个值.

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

This sheds some light on the concept but I don't really understand yet when an interceptor is injecting multiple values and when it isn't. For example, my own interceptor is only changing the headers. Does this mean its injecting only a single value?

这是我的拦截器

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的提供列表

This is the provide list of 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
  ],

推荐答案

来自ValueProvider的描述 我们可以为 multi 属性读取接口:

From the description of the ValueProvider interface we can read for the multi property:

当为真时，injector 返回一个实例数组.这很有用允许多个提供者分布在许多文件中以提供配置信息到一个公共令牌.

这意味着对于我们提供的值，将使用多个值(或类).

This means that for the token we are providing a value, more than one value (or class) is going to be used.

例如，参见 此示例()，其中指定令牌HTTP_INTERCEPTORS 使用类(useClass) ErrorInterceptor 和 SecurityInterceptor.为了让它工作，我们需要指定 multi: true 以便 Angular 知道将使用多个值(或类).

For instance, see this example () where it is specified for the token HTTP_INTERCEPTORS to use the classes (useClass) ErrorInterceptor and SecurityInterceptor. In order to get this working, we need to specify multi: true so Angular knows that multiple values (or classes) are going to be used.

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

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

A key point here is that HTTP_INTERCEPTORS is a multi-provider token. This means that when providing a new value or class for this token the property multi is required and it must be set to true.

在描述如何提供拦截器 声明的部分:

See in the HttpClient documentation when it is described how to provide an interceptor the part where it is stated:

注意 multi: true 选项.这个必需设置告诉 AngularHTTP_INTERCEPTORS 是用于注入数组的 multiprovider 的令牌值，而不是单个值.

这篇关于HTTP_INTERCEPTORS 的 multi: true 属性是什么意思?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！