programing

각도 인터셉트카 제외 특정 URL

muds 2023. 6. 15. 22:07
반응형

각도 인터셉트카 제외 특정 URL

저는 제 웹 API를 호출하는 모든 서비스의 헤더를 처리할 필요가 없도록 가로채기를 작성하고 있습니다.문제는 99%의 호출에 하나의 특정 헤더 집합이 필요하지만 나머지 1%는 하나의 헤더 집합만 필요하고 나머지 1%는 존재하는 다른 헤더 집합에서 작동하지 않는다는 것입니다.이것을 알고 있기 때문에 저의 아이디어는 2개의 인터셉트를 만드는 것입니다. 첫 번째는 그들이 모두 사용하는 1개의 헤더를 추가하고 두 번째는 1%를 제외한 나머지 헤더를 추가할 것입니다.

다음은 제가 효과가 있는 1%를 제외하는 방법입니다. 하지만 더 나은 방법이 있는지 알고 싶습니다.

intercept(request: HttpRequest<any>, next:HttpHandler: Observable<HttpEvent<any>> {
  let position = request.url.indexOf('api/');
  if (position > 0){
    let destination: string = request.url.substr(position + 4);
    let matchFound: boolean = false;

    for (let address of this.addressesToUse){
      if (new RegExp(address).test(destination)){
        matchFound = true;
        break;
      }
    }

    if (!matchFound){
      ...DO WORK to add the headers
    }
  }

Angular 12에서 업데이트, "context" 사용, 이 SO 참조

요청을 확인했음에도 불구하고 헤더를 사용하여 "스킵" 속성을 추가할 수 있습니다. 헤더에 스킵 속성이 있으면 요청을 반환하십시오.

export class CustomInterceptor implements HttpInterceptor {
    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        if (req.headers.get("skip"))
           return next.handle(req);
      
        ....
    }
}

그리고 당신은 필요한 모든 전화를 요격기를 "건너"하는 식으로 합니다.

this.http.get(url, {headers:{skip:"true"}});

을 확인한 후에req.headers.get("skip")Eliseo가 제안했듯이, 이 헤더는 Angular와 관련된 것일 뿐이고 API로 전송되어서는 안 되기 때문에 요청에서 제거하는 것이 좋습니다(실제로는 문제를 일으킬 수 있습니다).

const skipIntercept = request.headers.has('skip');

if (skipIntercept) {
    request = request.clone({
        headers: request.headers.delete('skip')
    });
}

결국 제가 하게 된 것은 인터셉트에 사용되고 싶지 않은 URL 배열(Regex Format)입니다.

import { Injectable } from '@angular/core';
import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class AddCustomHeadersInterceptor implements HttpInterceptor {
  urlsToNotUse: Array<string>;

  constructor(
  ) {

    this.urlsToNotUse= [
      'myController1/myAction1/.+',
      'myController1/myAction2/.+',
      'myController1/myAction3'
    ];
  }

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (this.isValidRequestForInterceptor(request.url)) {
      let modifiedRequest = request.clone({
        setHeaders: {
          //DO WORK HERE
        }
      });

      return next.handle(modifiedRequest);
    }
    return next.handle(request);
  }

  private isValidRequestForInterceptor(requestUrl: string): boolean {
    let positionIndicator: string = 'api/';
    let position = requestUrl.indexOf(positionIndicator);
    if (position > 0) {
      let destination: string = requestUrl.substr(position + positionIndicator.length);
      for (let address of this.urlsToNotUse) {
        if (new RegExp(address).test(destination)) {
          return false;
        }
      }
    }
    return true;
  }
}

기본적으로 생성되는 경우 HttpClient는 인터셉터를 사용합니다.이 문제를 방지하려면 생성자를 사용하여 HttpClient의 다른 인스턴스를 만들 수 있습니다.

@Injectable()
class Service {
  private customHttpClient: HttpClient;

  constructor(backend: HttpBackend) {
    this.customHttpClient = new HttpClient(backend);
  }
}

관습HttpClient 인스턴스는 인터셉트카를 사용하지 않습니다.

가로채기를 사용하는 대신 HttpClient를 확장할 수 있습니다.

Interceptor World에서는 모든 요청이 실행되기 전에 중지됩니다(마사지)(헤더 추가).

HttpClient World에서는 클라이언트 개체 인스턴스화 시 주의해야 합니다.

필요하다고 판단되면 다양한 변형 자체를 고려할 수 있습니다. HttpClient99백분율 변형, HttpClientOnePercent 변형 등입니다.

아래 링크를 통해 앞서 나갈 수 있습니다.

https://medium.com/ @admin_87321/syslog-syslog 클라이언트-6b33a7a1a4d0

адрейкныйчинрен의 답변 업데이트

import { Injectable } from '@angular/core';
import { HttpClient, HttpBackend } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class CartService {
  private customHttpClient: HttpClient;

  constructor(private http: HttpClient, backend: HttpBackend) { 
    this.customHttpClient = new HttpClient(backend);
  }

  getZohoItems() {
    // call zoho url
    return this.customHttpClient.get('http://zoho.com/api/orders/');
  }

  getItems() {
    // call localhost:8000 url
    return this.http.get('/api/orders/');
  }
}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
if (req.url.indexOf('Url that you want to hide') === -1) {
  this.spinner.show();
  return next.handle(req).pipe(
    finalize(() => this.spinner.hide())
  );
}
if (req.url.indexOf('Url that you want to hide') !== -1) {
  this.spinner.hide();
}
return next.handle(req);

}

언급URL : https://stackoverflow.com/questions/55522320/angular-interceptor-exclude-specific-urls

반응형