如何使用請求類將自定義字段附加到HTTP請求標頭

Question

如何使用Angular2中的請求類將自定義字段附加到HTTP請求標頭？ 我找到解決類似問題的帖子，但他們沒有使用Request類。

我的代碼如下。

let headers: Headers = new Headers(); 
headers.append('foo', 'bar'); 

let req: any = { 
    method : RequestMethod.Get, 
    url : '/test.json', 
    headers: headers, 
}; 

// this.http is Http instance variable. 
this.http.request(new Request(req)).map((res: any) => res.json()); 

這是非常簡單的代碼。 但是，執行此操作時，我無法使用Google Chrome的開發人員工具在HTTP請求標頭中找到自定義字段。

參考：https://angular.io/docs/js/latest/api/http/index/Request-class.html

---

有可能重現此問題。 下面的代碼應該會得到XHR 400錯誤，但這不是問題。但請注意，請求標頭沒有自定義字段。

http://plnkr.co/edit/arCFx69V9H1Cl0pJXBzO?p=preview

Answer 1

你可能忘了導入Headers類：

import {Http, Headers, ...} from 'angular2/http'; 

你也可以使用下面的代碼：

let headers: Headers = new Headers(); 
headers.append('foo', 'bar'); 

this.http.get('test.json', { headers }).map((res: any) => res.json()); 

而且不要忘記訂閱對返回可觀察執行請求，因爲可觀察者是懶惰的：

let headers: Headers = new Headers(); 
headers.append('foo', 'bar'); 

this.http.get('test.json', { headers }) 
    .map((res: any) => res.json()) 
    .subscribe((data) => { 
    console.log(data); 
    });