get request not working in angular 7 using HttpHeaders

Question

i am using HttpHeaders used to set or unset authorization token but i am getting error like

Argument of type 'OperatorFunction' is not assignable to parameter of type 'OperatorFunction, Response

so how to skip or unskip of better way, because some time token is null

    const httpOptions = {
      headers: new HttpHeaders({
        'Content-Type': 'application/json',
        'Authorization': 'Token ' + token,
      })
    };

    const httpOptions1 = {
      headers: new HttpHeaders({
        'Content-Type': 'application/json',
      })
    };


   let opt;
   if (token) {
     opt = httpOptions
   } else {
    opt = httpOptions1

   }


    return this.http.get<any>(this.mURL , opt)
      .pipe(map((response: Response) => {
        return response;
      }), catchError((error: Response) => {
        return throwError(error.status);
      }));

Mohamed Maher · Accepted Answer · 2019-07-15 11:51:06Z

1

the best solution to create an interceptor : create a new file :

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

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any> , next: HttpHandler ): Observable<HttpEvent<any>> {
    const token = localStorage.getItem('token'); // or from wherever you like to get your token 
    if (token) {
      req = req.clone({
        headers : req.headers.set('authorization', 'Bearer ' + token)
      });
      req = req.clone({
        headers  : req.headers.set('Accept', 'application/json, text/plain, */*') // this for accepting the most of body requests 
      });
      return next.handle(req).pipe(
        map((event: HttpEvent<any>) => {
          if (event instanceof HttpResponse) {
           console.log('event --->>', event); // you can remove that line in production build stage 
          }
          return event;
        }
      ));
    } else {
      return next.handle(req);
    }
  }
}

and your interceptor into you app.module.ts providers

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

it will add the token in every request you will make

answered Jul 15, 2019 at 11:51

Mohamed Maher

3132 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

karnataka Over a year ago

i think this procedure is best way

Collectives™ on Stack Overflow

get request not working in angular 7 using HttpHeaders

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related