在angular2 api调用中向头添加授权

时间:2017-03-01 23:34:38

标签: angular authorization

在一周的大部分时间里,我一直在喋喋不休地谈论这个问题,我终于发出了对StackOverflow世界的呼吁,希望之前有人遇到过这个问题,并且可以帮我解决这个问题。

我是Angular2的新手,这是我的第一个应用程序。我正在尝试连接到api电话以获取业务列表。我在一个组件上有一个搜索输入字段,用于在服务中进行调用。呼叫一直在失败,因为我似乎无法通过我拥有的会话令牌中的正确身份验证将标头传递给呼叫。它总是通过 {" content-type":" application / json"}。

以下是我的服务电话:

searchAllForTerm(term: string): Promise<Business[]> {
   let headers = new Headers();
   headers.append('Content-Type', 'application/json');
   let authToken = localStorage.getItem('token');
   headers.append('Authorization', `Bearer ${authToken}`);
   return this.http.get(this.businessesUrl + term, {headers})
     .toPromise()
     .then(this.extractData)
     .catch(this.handleError);
}

我已导入

import { Http, Response, Headers} from '@angular/http'; 

在文件上并将构造函数设置为

constructor(private http: Http) {}

但是,当进行呼叫时,授权不在标题中。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

所以我想出来了!我按照Angular 2英雄之旅教程为我的应用程序构建了骨架。在该教程中,他们让您在本地构建一个假数据库以用作api。因为我试图打电话给那个api,我试图调用真正的api就是抛出了这个奇怪的未经授权的错误响应。