在 Angular2 中发送带有标头的 HTTP 请求

Question

我正在尝试构建一个连接到 twitter api 的应用程序。为此，我需要使用 Angular2 发送带有一组标头的 http get 请求。

注意，下面的 curl 请求是成功的（假设正确的密钥就位）。

这是我尝试过的，唯一的问题是，通过以下实现，我无法传递必要的标头。

想知道是否有人遇到过这种情况并有任何解决方法的建议？

提前致谢

constructor(private _http: Http) {

}

getTwitterResponse() {
         return this._http.get('https://api.twitter.com/1.1/statuses/home_timeline.json')
            .map(res => res.text);
}

带有标题的卷曲请求示例（已删除身份验证密钥）

 curl --get 'https://api.twitter.com/1.1/statuses/home_timeline.json' --header 'Authorization: OAuth oauth_consumer_key="123456", oauth_nonce="123456", oauth_signature="f%123456%3D", oauth_signature_method="HMAC-SHA1", oauth_timestamp="1475158916", oauth_token="123456", oauth_version="1.0"' --verbose

Answer 1

您可以像这样向您的请求添加标头：

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

getTwitterResponse() {

let headers = new Headers({ "Content-Type": "application/json" });
let options = new RequestOptions({ headers: headers });
let url = 'https://api.twitter.com/1.1/statuses/home_timeline.json';

     return this._http.get(url, options).map(res => res.text);
}

这里发生的事情的解释：请求get 的Http 具有以下签名：

get(url: string, options?: RequestOptionsArgs)

第二个参数是可选的，它的类型是RequestOptionsArgs，这是一个用于构造RequestOptions的接口，这意味着你可以将RequestOptions作为第二个参数传递给get。 RequestOptionsArgs 是一个具有以下属性的接口：

export interface RequestOptionsArgs {
    url?: string;
    method?: string | RequestMethod;
    search?: string | URLSearchParams;
    headers?: Headers;
    body?: any;
    withCredentials?: boolean;
    responseType?: ResponseContentType;
}

所有属性都是可选的，这就是为什么我们只能将headers 传递给我们的options。您可以随意更改Content-Type，并且可以添加多个标题：

headers: Headers = new Headers({
    'First header': 'First value',
    'Second header': 'Second value',
    'Third header': 'Third value',
    'Fourth header': 'Fourth value'
});

您可以在以下链接中阅读有关我刚刚喋喋不休的所有内容的更多信息：

• RequestOptions
• RequestOptionsArgs
• Headers