how to set token after login in restangular?

Question

How can I set authentication token in the header after login in restangular? Here is my login code and the app module declaration.

    this.authService
      .authenticate(this.login)
      .then(res => {
        if (res.data) {
          localStorage.setItem("currentUser", JSON.stringify(res.data));
          // Restangular.setDefaultRequestParams({ authentication: res.data.token }); 
          // set heder token here 
          this.router.navigate(["member/home"]);
        } else {
          console.log("not found");
        }
      })
      .catch(err => {
        console.log(err);
      });

app.module.ts

  RestangularProvider.setBaseUrl(environment.apiUrl);
  let currentUser = JSON.parse(localStorage.getItem("currentUser"));
  if (currentUser) {
    RestangularProvider.setDefaultHeaders({
      Authorization: currentUser.token
    });
  }

Answer 1

You can acheive this using interceptor pattern :

First, create a new service :

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

@Injectable()
export class JwtInterceptor implements HttpInterceptor {
    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

        let currentUser = JSON.parse(localStorage.getItem('currentUser'));
        if (currentUser && currentUser.token) {
            request = request.clone({
                setHeaders: { 
                    Authorization: `Bearer ${currentUser.token}`
                }
            });
        }

        return next.handle(request);
    }
}

update the app.module.ts :

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

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