Angular2 - HTTP请求选项中的头部信息（HEADERS）

Question

我目前在tslint方面有一个问题，希望有人能指点我正确的方向。

我正在尝试使用Angular2框架提供的HTTP发送HTTP GET请求。在这个请求中，我必须指定内容类型和令牌认证。

我的代码示例：

let headers = new Headers();
let authToken = this._user.getUser().JWT;
headers.append('Content-Type', 'application/json');
headers.append('Authorization', `Bearer ${authToken}`);
let options = new RequestOptions({ headers: headers });

this._http.get('http://' + url '/', options)
            .timeout(3000)
            .subscribe(
                (res) => {

这个方法可行，但是tslint会抱怨：

"TS2345：类型为"{headers：Headers;}"的参数不能分配给类型"RequestOptionsArgs"的参数。属性“headers”的类型不兼容。类型“Headers”与类型“Headers”不可分配， 但它们不相关。类型“Headers”中缺少属性“keys”。"

感谢支持。

- Zander17

---

考虑使用const代替let来声明选项和标题。 - Amin

Answer 1

更新

从今天开始，@angular/http已经被弃用，应该使用@angular/common/http。因此，与http headers一起工作的最佳方法是导入import { HttpHeaders } from '@angular/common/http';（文档）。

旧回答

您应该导入的Headers类型是import { Headers } from '@angular/http';。

请检查您的导入内容。

- bviale

---

就是这样！我正在使用Phpstorm，它通常非常好并清楚地显示我错过了依赖项，但这次没有。此外，我认为tslint的消息不太清楚。干杯 :) - Zander17

即使你没有导入它，某种方式下还是会有一个Headers类。因此，你必须确保导入正确的类（参见上面的答案），才能使其正常工作。 - GoTo

对于 Angular 5，这个命令可以帮助我导入 import { Headers, RequestOptions } from '@angular/http';，具体信息可以查看文档。 - Abhi

@Abhi 文档中说 Headers 已经被弃用，我们应该使用 @angular/common/http 中的 HttpHeaders。但是这并不起作用... 你有什么想法吗？ - DonkeyBanana

@DonkeyBanana 我认为这篇文章是一个很好的参考。 - Abhi

Answer 2

您需要通过以下方式更新标题：

let headers =  {headers: new  HttpHeaders({ 'Content-Type': 'application/x-www-form-urlencoded'})};

- Vivek Kapoor

Answer 3

Angular 5更新

import { RequestOptions } from '@angular/http';

我在正确答案的评论中找到了这个，如果对某人有帮助，祝好运。

文档: https://angular.io/api/http/RequestOptions

- ValRob

---

这已经被弃用了。 - test_124

是的，看起来它在最近几天有所改变。请检查文档，现在应该是 import { RequestOptions } from '@angular/http';。 - ValRob

Answer 4

最初的回答

// Json内容类型的标题示例

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

const Url = 'http://localhost:3000/';
const headers = new Headers;
const body = JSON.stringify({
title: "data" 
});
headers.append('Content-Type', 'application/json');
this.http.post(Url, body, { headers: headers })
.pipe(map((res => res)));

- arul prince