web-dev-qa-db-ja.com

HTTP_INTERCEPTORSのmulti：true属性はどういう意味ですか？

私はAngularを初めて使用し、インターセプターを作成しました。複数のチュートリアルによると、次のようにHTTP_INTERCEPTORSにapp.moduleを含める必要があります。

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

そのmulti: true属性が何を意味するのか、そしてそれが省略できるかどうか疑問に思いました。

この属性に関する angular.io ガイドを読みました。彼らはそれを次のように説明しています：

私はこの部分を理解していません：

Multi：trueオプションに注意してください。この必須設定は、HTTP_INTERCEPTORSが単一の値ではなく、値の配列を挿入するマルチプロバイダーのトークンであることをAngularに伝えます。

これは概念にいくらかの光を当てますが、インターセプターが複数の値を注入している場合とそうでない場合はまだよくわかりません。たとえば、私自身のインターセプターはヘッダーのみを変更しています。これは、単一の値のみを注入することを意味しますか？

これは私のインターセプターです

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
  ],
angularangular5angular-http-interceptors
5
Maurice

ValueProvider インターフェイスの説明から、multiプロパティについて読み取ることができます。

Trueの場合、injectorはインスタンスの配列を返します。これは、複数のプロバイダーが多数のファイルに分散して、構成情報を共通のトークンに提供できるようにする場合に役立ちます。

これは、値を提供するトークンに対して、複数の値（またはクラス）が使用されることを意味します。

たとえば、 この例 （これはサンプルプロジェクトです）トークンHTTP_INTERCEPTORSがクラス（useClass）ErrorInterceptorおよびSecurityInterceptorを使用するように指定されている場合。これを機能させるには、multi: trueを指定する必要があるため、Angularは、複数の値（またはクラス）が使用されることを認識しています。

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

ここで重要な点は、 HTTP_INTERCEPTORS がmulti-providerトークンであるということです。これは、このトークンに新しい値またはクラスを提供する場合、プロパティmultiが必要であり、trueに設定する必要があることを意味します。

インターセプターを提供する それが記載されている部分の方法が説明されている場合は、 HttpClient ドキュメントを参照してください。

multi: trueオプションに注意してください。この必須の設定は、Angular HTTP_INTERCEPTORSがmultiprovider単一の値ではなく、値の配列を挿入します。

13
lealceldeiro