কৌণিক অ্যাপ্লিকেশনটিতে একাধিক এইচটিটিপি ইন্টারসেপ্টর যুক্ত করুন

Question 1

কৌণিক 4 অ্যাপ্লিকেশনটিতে একাধিক, স্বতন্ত্র HTTP ইন্টারসেপ্টরগুলি কীভাবে যুক্ত করবেন?

আমি providersএকাধিক ইন্টারসেপ্টর দিয়ে অ্যারে বাড়িয়ে এগুলি যুক্ত করার চেষ্টা করেছি । তবে কেবলমাত্র শেষটি কার্যকর করা হয়, Interceptor1তা উপেক্ষা করা হয়।

@NgModule({
  declarations: [ /* ... */ ],
  imports: [ /* ... */ HttpModule ],
  providers: [
    {
      provide: Http,
      useFactory: (xhrBackend: XHRBackend, requestOptions: RequestOptions) =>
        new Interceptor1(xhrBackend, requestOptions),
      deps: [XHRBackend, RequestOptions],
    },
    {
      provide: Http,
      useFactory: (xhrBackend: XHRBackend, requestOptions: RequestOptions) =>
        new Interceptor2(xhrBackend, requestOptions),
      deps: [XHRBackend, RequestOptions]
    },
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

আমি স্পষ্টতই তাদের একক Interceptorশ্রেণিতে সংযুক্ত করতে পারতাম এবং এটি কাজ করা উচিত। তবে, আমি এড়াতে চাই যেহেতু এই ইন্টারসেপ্টরগুলির সম্পূর্ণ ভিন্ন উদ্দেশ্য রয়েছে (ত্রুটি পরিচালনা করার জন্য একটি, লোডিং সূচকটি দেখানোর জন্য একটি)।

তাহলে আমি কীভাবে একাধিক ইন্টারসেপ্টর যুক্ত করতে পারি?

Question 2

Httpএকাধিক কাস্টম বাস্তবায়ন করতে দেয় না। তবে @ ইস্তাসের উল্লেখ হিসাবে কৌণিক দল সম্প্রতি একটি নতুন এইচটিটিপিপ্লাইয়েন্ট পরিষেবা যুক্ত করেছে (৪.৩ প্রকাশ করুন) যা একাধিক ইন্টারসেপ্টর ধারণাকে সমর্থন করে। আপনি HttpClientপুরানো হিসাবে আপনি বাড়ানোর প্রয়োজন হবে না Http। HTTP_INTERCEPTORSপরিবর্তে আপনি একটি বাস্তবায়ন সরবরাহ করতে পারেন যা 'multi: true'বিকল্পের সাথে অ্যারে হতে পারে :

import {HTTP_INTERCEPTORS, HttpClientModule} from '@angular/common/http';
...

@NgModule({
  ...
  imports: [
    ... ,
    HttpClientModule
  ],
  providers: [
    ... ,
    {
      provide: HTTP_INTERCEPTORS,
      useClass: InterceptorOne,
      multi: true,
    },
    {
      provide: HTTP_INTERCEPTORS,
      useClass: InterceptorTwo,
      multi: true,
    }
  ],
  ...
})

বাধা:

import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
...

@Injectable()
export class InterceptorOne implements HttpInterceptor {

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log('InterceptorOne is working');
    return next.handle(req);
  }
}

@Injectable()
export class InterceptorTwo implements HttpInterceptor {

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log('InterceptorTwo is working');
    return next.handle(req);
  }
}

এই সার্ভার কলটি উভয় ইন্টারসেপ্টরের লগ বার্তা মুদ্রণ করবে:

import {HttpClient} from '@angular/common/http';
...

@Component({ ... })
export class SomeComponent implements OnInit {

  constructor(private http: HttpClient) {}

  ngOnInit(): void {
    this.http.get('http://some_url').subscribe();
  }
}