在HTTP请求上添加验证标头 - Angular 4

我的Angular 4应用程序上有一个HttpInterceptor，它工作得很好。但有些事情我想在这里实现，以及时可用注入一个JSON网络令牌，但我还没有发现这样做的正确方法，请检查下面的代码：在HTTP请求上添加验证标头 - Angular 4

import {Injectable} from '@angular/core'; 
import {HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpResponse} from '@angular/common/http'; 
import {Observable} from "rxjs"; 
import {ToasterService} from "angular2-toaster"; 
import 'rxjs/add/operator/do'; 

@Injectable() 
export class GobaeInterceptor implements HttpInterceptor { 
    constructor(private toasterService: ToasterService){ 
    } 
    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
     next.handle(req).subscribe(event => { 
       if (event instanceof HttpResponse) { 
        if (localStorage.getItem('Token')) { 
         //THIS ISN'T WORKING: 
         event.headers.append('authentication', `${localStorage.getItem('Token')}`); 
        } 
        let response = event.body; 
        if(response.Error){ 
         this.toasterService.pop('error', 'Error '+response.Code, response.Message); 
        } 
       } 
      }, error => {console.log(error)}); 
     return next.handle(req); 
    } 
}

它不涨任何错误，但它不会设置它（我检查了网络选项卡上的请求）。此外，我试图传递一个硬编码的字符串，而不是从localStorage获得它的结果相同。

来源

2017-08-25 Multitut

这是我如何做到这一点：

export class JWTInterceptor implements HttpInterceptor { 

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

     let headerName: string = 'Authorization'; 

     let authScheme: string = 'Bearer '; 

     let token: string = localStorage.getItem('Token'); 

     return next.handle(() => { 
      return request.clone({ 
       setHeaders: { 
        [headerName]: `${authScheme}${token}` 
       } 
      }); 
     }); 

    } 

}

来源

2017-08-25 14:26:52 jlareau

谢谢！这是一个角4实现？它告诉我，我在类型'（）=> any'中缺少'url'。尽管如此，我在我的代码中集成了setHeaders：{headerName]：'$ {authScheme} $ {token}' }，但仍然看不到通话中的令牌 – Multitut

我不知道您的警告。我的代码几乎是从Angular 4.3.5上的工作代码复制粘贴的。你确定你的拦截器加载正确吗？也许把一个console.log来检查。 – jlareau

其他一切工作正常，我检查了我的角度版本，它也是4.3.5。你能提供你的完整例子吗？ – Multitut

在HTTP请求上添加验证标头 - Angular 4

回答

相关问题