Search code examples
angulartypescriptangular-http-interceptors

Angular 6 HTTP Interceptor not setting headers


I'm trying to make a jsonwebtoken interceptor and for some reason it doesn't set the header at all.

For my providers I have

import { TokenInterceptorService } from './token-interceptor.service';
...
providers: [AuthService, AuthGuard, {
        provide: HTTP_INTERCEPTORS,
        useClass: TokenInterceptorService,
        multi: true
}]

as my TokenInterceptorService is pretty simple too:

import { Injectable } from '@angular/core';
import { HttpInterceptor } from '@angular/common/http';

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

    constructor() { }

    intercept(req, next) {

        let tokenizedReq = req.clone({
            setHeader: {
                Authorization: 'Bearer xx.yy.zz'
            }
        })

        return next.handle(tokenizedReq);
    }
}

if I log tokenizedReq the headers have nothing. I must be overlooking something.


Solution

  • Not setHeader but setHeaders - in plural form

    let tokenizedReq = req.clone({
         setHeaders: {
             'Authorization': 'Bearer xx.yy.zz'
         }
    })