在Angular2中發送帶有標題的HTTP請求

我正在嘗試構建一個連接到twitter api的應用程序。爲了達到這個目的，我需要使用Angular2發送一個帶有一組頭的http get請求。在Angular2中發送帶有標題的HTTP請求

請注意，下面的curl請求是成功的（假設有正確的密鑰）。

這是我試過的，唯一的問題是，在下面的實現中，我無法傳遞必要的頭文件。

想知道是否有人遇到過這個問題，並對如何解決有什麼建議？

在此先感謝

constructor(private _http: Http) { 

} 

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

捲曲索取樣品瓦特/頭（W /刪除AUTH鍵）

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

來源

2016-09-29 AnchovyLegend

這就是對於angular1爲true，但angular2略有不同 – AnchovyLegend

是的，先生。 get的第一個參數是一個url，第二個參數必須是RequestOptionsArgs的一個實例，而不是Header類型。 – AnchovyLegend

沒錯，但是如果你通過標題來獲得第二個參數，你會得到一個錯誤。 – AnchovyLegend

您添加頁眉您的要求是這樣的：

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的接口，這意味着可以通過RequestOptionsget到作爲第二個參數。 RequestOptionsArgs是具有以下屬性的接口：

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

所有屬性都是可選的，這就是爲什麼我們可以通過只headers我們options。你可以用任何你想要改變Content-Type，你可以添加超過1頭：

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

你可以閱讀更多有關的一切，我只是blabbed有關以下鏈接：

來源

2016-09-29 14:32:44

謝謝Stefan，我會試試這個報告。 – AnchovyLegend

在我試圖調用this._http等線我得到一個錯誤說：「在AppComponent的實例化過程中的錯誤！」，任何想法？ – AnchovyLegend

@AnchovyLegend在添加我建議的內容之前，您的應用程序是否工作？我發現很難相信在'get'請求中添加'RequestOptions'可能會導致'AppComponent實例化時出現錯誤！':-)你應該發佈'AppComponent'。 –

在Angular2中發送帶有標題的HTTP請求

回答

相關問題