Как я могу использовать запросы fetch и interceptor? - PullRequest
Новая
       16

Как я могу использовать запросы fetch и interceptor?

0 голосов
/ 29 октября 2019

У меня проблема с угловым перехватчиком. У меня fetch запрос http. И я хочу, чтобы в случае неудачи я уловил ошибку перехватчиком. Но когда я посылаю запрос на получение, мой перехватчик не работает. Перехватчик не видит этот запрос. Когда я редактирую запрос get и использую HttpClient (this.http.get ...) - все хорошо, все работает. Как я могу использовать запросы fetch и interceptor? 

@Injectable()
export class TestInterceptor implements HttpInterceptor {

  constructor() {
    console.log('constructor of interceptor');
  }

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

@NgModule({
  declarations: [
    TestComponent
  ],
  imports: [
    SharedModule,
    HttpClientModule
  ],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: TestInterceptor,
      multi: true
    },
  ]
})
export class TestModule {}

sendRequest(url: string, method = 'GET', body = null): Promise<any> {
    let response: Response;

    return fetch(url, {
      method,
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: body ? JSON.stringify(body) : null
    });
  }

1 Ответ

0 голосов
/ 29 октября 2019

Добавить внутренних провайдеров в app.module.ts 

{
      provide: HTTP_INTERCEPTORS,
      useClass: ApiGatewayInterceptor,
      multi: true,
    }

Создать общий сервис: 

import { Injectable,OnInit,Component } from '@angular/core';
import {Http,Headers,RequestOptions, RequestOptionsArgs,Response} from '@angular/http';
import { HttpEvent, HttpHeaders,HttpHandler, HttpInterceptor, HttpRequest, HttpClient,HttpParams,HttpResponse,HttpErrorResponse } from '@angular/common/http';

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise'; 

import { environment } from '../../environments/environment';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/observable/throw'
import 'rxjs/add/operator/catch';   


@Injectable()
export class ApiGatewayInterceptor implements HttpInterceptor {
    private queryParam: string = '';
    constructor() { }

    public intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 



    }
}

Использовать вызов apigateway следующим образом: 

     formUrlParam(data) {
        let queryString: string = ''; 
        let httpParams = new HttpParams();
        Object.keys(data).forEach(function (key) {
            httpParams = httpParams.append(key, data[key]);
        }); 
        return httpParams; 
    }
    post<T>(url, params)  { 
        let httpParams = this.formUrlParam(params);  
        return new Promise((resolve, reject) => { 
            let result = this.http.post(url,params).subscribe(
                (response) => resolve(response),
                (error) => resolve(error)
            ) 
        });  
    }

    patch<T>(url, params)  { 
        console.log(params);
        let httpParams = this.formUrlParam(params);  
        return new Promise((resolve, reject) => { 
            let result = this.http.patch(url,params).subscribe(
                (response) => resolve(response),
                (error) => resolve(error)
            ) 
        });  
    } 
    get<T>(url,params) {
        let httpParams = this.formUrlParam(params); 
        return new Promise((resolve, reject) => { 
            let result = this.http.get(url,{params: httpParams }).subscribe(
                (response) => resolve(response),
                (error) => resolve(error)
            ) 
        });  
    }
...