http post請求中的Angular2超時

Question

是否可以在發布請求中設置 3 秒的超時時間？ 如何 ？

我的代碼

this.http.post('myUrl', 
    MyData, {headers: Myheaders})
        .map(res => res.json())
        .subscribe(
            data => this.ret = data,
            error => console.debug('ERROR', error),
            () => console.log('END')
        );

Answer 1

您可以像這樣使用timeout運算符：

this.http.post('myUrl', 
        MyData, {headers: Myheaders})
         .timeout(3000, new Error('timeout exceeded'))
         .map(res => res.json())
         .subscribe(
           data => this.ret = data,
           error => console.debug('ERROR', error),
           () => console.log('END')
         );

Answer 2

您可能需要像這樣導入超時

import 'rxjs/add/operator/timeout'

如果沒有 rxjs 5.0.1和 angular 2.3.1 ，我就無法讓它工作

2018 年 4 月 20 日編輯

請不要以這種方式導入操作符，在 rxjs +5.5 中，您可以導入這樣的操作符

import { timeout } from 'rxjs/operators/timeout';
// Use it like so
stream$.pipe(timeout(3000))

請查看此文檔，其中詳細解釋了可管道操作符。

Answer 3

我修改了 Thierry 的答案以使其與最新版本一起使用。 需要去掉超時函數的第二個參數。 根據關於 angular-cli 問題的討論，超時函數現在總是拋出 TimeoutError 。

this.http.post('myUrl', 
    MyData, {headers: Myheaders})
     .timeout(3000)
     .map(res => res.json())
     .subscribe(
       data => this.ret = data,
       error => console.debug('ERROR', error),
       () => console.log('END')
     );