Значение переменной не отображается в методе перехвата - HTTP Interceptors Angular - PullRequest
Новая
       31

Значение переменной не отображается в методе перехвата - HTTP Interceptors Angular

0 голосов
/ 28 июня 2019

Я пытаюсь передать значение переменной в заголовках HTTP-запроса с помощью HTTP-перехватчиков.Но этого не происходит

Я попытался передать переменную из AppComponent в Service.Я вижу значение переменной, но в том же сервисе в разделе Метод перехвата я не могу 

import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable, throwError } from 'rxjs';
import { catchError, retry } from 'rxjs/operators';
import * as $ from 'jquery';


@Injectable({
  providedIn:'root'
}) 
export class AppInterceptorService implements HttpInterceptor{

  etag : string
  headers : HttpHeaders

constructor() {}
getEtag(etag : string) {

  if(etag) {
    this.etag = etag;
    console.log("Etag from Interceptor :"+ this.etag)
   }
   else {
     this.etag = '*'
   }

}

handleError(error : HttpErrorResponse) {
    console.log("Error Occured")
    return throwError(error)
}

intercept(req: HttpRequest<any>, next: HttpHandler,): Observable<HttpEvent<any>> {
console.log("interceptetag : " + this.etag)

if(req.method === "GET"){
  this.headers = new HttpHeaders ({
    'Content-Type'    : 'application/json;odata=verbose',
    'Accept'          : 'application/json;odata=verbose',
    'X-RequestDigest' : $("#__REQUESTDIGEST").val(),
    'X-HTTP-Method': 'MERGE',
    'IF-MATCH': "40",

  })
}

if(req.method === "POST"){
  console.log("Etag form POST :"+this.etag)
  this.headers = new HttpHeaders ({
    'Content-Type'    : 'application/json;odata=verbose',
    'Accept'          : 'application/json;odata=verbose',
    'X-RequestDigest' : $("#__REQUESTDIGEST").val(),
    'X-HTTP-Method': 'MERGE',
    'IF-MATCH': this.etag,

  })
}


  const clone = req.clone({'headers' : this.headers})

    return next.handle(clone)
    .pipe(
        retry (1),
        catchError(this.handleError)
    )
}


}

при нажатии кнопки: (Класс компонента) 

update() {
    console.log("ETag :" + this.etag)  // "40"
    this.appInterceptorService.getEtag(this.etag) // Here I'm passing "40" ro above service
    this.sharepointService.PostReqNo(this.counter).subscribe()

AppModule 

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule,FormsModule } from '@angular/forms';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { AppComponent } from './app.component';
import { SharePointService } from './services/sharepointservice.service';
import { AppInterceptorService } from './services/app-interceptor.service';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    ReactiveFormsModule,
    FormsModule,
    HttpClientModule

  ],
  providers: [SharePointService, 
              {'provide' : HTTP_INTERCEPTORS,
               'useClass' : AppInterceptorService,
                'multi' : true}],

  bootstrap: [AppComponent]
})
export class AppModule { }

1 Ответ

0 голосов
/ 28 июня 2019

Согласно документации , перехват имеет тип возврата Observable<HttpEvent<any>>, и вы ничего не возвращаете в своей функции перехвата.Существует также синтаксическая ошибка в вашей функции перехвата (вы указали :, но не указали тип возвращаемого значения). Вы можете либо полностью удалить :, либо указать тип возвращаемого значения Observable<HttpEvent<any>>, хотя было бы лучше указать возвращаемое значениевведите, чтобы код оставался строго типизированным.

Вы можете вернуть пустую наблюдаемую информацию для целей тестирования. 

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
  console.log("interceptetag : " + this.etag) 
  return new Observable<any>();
}

Вот рабочий пример для StackBlitz

...