Angular2 - HTTP RequestOptions 标头

Posted 2023-03-13

【中文标题】Angular2 - HTTP RequestOptions 标头

【英文标题】：Angular2 - HTTP RequestOptions HEADERS

【发布时间】：2017-08-29 13:20:15

【问题描述】：

我目前对 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' 类型中缺少属性 'keys'。”

感谢您的支持。

【问题讨论】：

考虑在选项和标题中使用 const 而不是 let

【参考方案1】：

更新

截至今天，@angular/http 已成为deprecated，应使用@angular/common/http 代替。所以处理http头最好的方法是导入import HttpHeaders from '@angular/common/http';（documentation）。

旧答案

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

检查您的导入

【讨论】：

就是这样！我正在使用 phpstorm 并且通常非常好，并且清楚地告诉我我错过了一个依赖项，但这次没有。此外，我发现 tslint 消息不是很清楚。干杯:)

不知何故有一个 Headers 类，即使你不导入它。因此，您必须确保导入正确的（请参阅上面的答案）才能使其正常工作。

对于 Angular 5，这对我有帮助 import Headers, RequestOptions from '@angular/http'; DOCUMENTATION

@Abhi 它在文档中说 Headers 已弃用，我们应该使用 @angular/common/http 中的 HttpHeaders我> 相反。但这并没有真正的工作......想法？

@DonkeyBanana 我发现THIS 是一个很好的参考

【参考方案2】：

您必须通过以下方式更新标题：

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

【参考方案3】：

Angular 5 更新

import  RequestOptions  from '@angular/http';

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

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

【讨论】：

已弃用。

是的，最近几天好像发生了变化。检查文档，现在是import RequestOptions from '@angular/http';

【参考方案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)));