angular - 如何使用 JWT Token 以 Angular 5 存储获取响应数据

Question

getEmployeeList():Observable<Employee[]>{
  return this.http.get<Employee[]>('moi/employee/getEmp', AuthService.getHttpOptions());
}

我的AuthService.getHttpOptions()方法是：

 public static getHttpOptions(): any {''
    var httpOptions = {
        headers: new HttpHeaders({
            'Content-Type':  'application/json',
            'observe': "body",
            'Authorization': "Bearer " + localStorage.getItem("authtoken")
          })
    };
    return httpOptions;
}

得到错误：

类型 'Observable<HttpEvent<Employee[]>>' 不可分配给类型 'Observable<Employee[]>'。

类型“HttpEvent<Employee[]>”不可分配给类型“Employee[]”。

类型“HttpSentEvent”不可分配给类型“Employee[]”。

“HttpSentEvent”类型中缺少属性“includes”。

标签： angularangular5typescript2.0angular4-httpclient

Answer 1

import { Observable } from 'rxjs/Observable';
import {Http,Headers,RequestOptions }  from '@angular/http';
import 'rxjs/add/operator/map';
import { tokenNotExpired} from 'angular2-jwt';
export Class serviceName{
  authToken;
  headers;
  // After login we have already store jwt token on the localstorage
  constructor(private _http:Http,private _router:Router) { 
    this.loadToken();
    this.headers = new Headers({'Content-Type': 'application/json', 'Authorization': 
     'Bareer '+this.authToken});
   }
   loadToken(){
     this.authToken = localStorage.getItem('token');
   }
  createAuthenticateHeaders(){
    this.loadToken();
    this.options = new RequestOptions({
      'headers':new Headers({
        'Content-Type': 'application/json',
        'authorization':this.authToken
      })
    });
  }
   getEmployeeList(userInfo){
    this.createAuthenticateHeaders();
    return this._http.get(this.domain+'/products', {headers:this.headers})
     .map(response => response.json());
   }
 }

您可以像这样绑定令牌。脚步

• 登录并生成 authtoken
• 将令牌存储在会话存储中。enter code here
• 然后在服务的构造函数中加载该令牌。
• 然后创建标题
• 通过在标头中传递令牌调用任何服务方法。