Question

我的提供商为http.get请求提供了API：

join(){
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    headers.append('x-access-token',this.getToken());
    return Observable.create(observer =>{
        this.http.get('/localhost/chat/'+this.room,{headers : headers})
                .map(res => res.json())
                .subscribe(
                    data=>{                         
                        observer.next(data);
                    },
                    (err) =>{
                        observer.error(err);
                    }
                );
    })
}

我的page.ts只是循环使用此API：

join(){
    this.myProvider.join().subscribe(
        (data)=>{
            if(data.success){
                ... /* doing smt */ ....
                this.join();
            }else{
                this.message=data.message;
                //TBD sleep....
                //this.join();
            }
        },
        (err) => {
            this.message="Connectivity with server Lost...";
        });
  }

我的问题是：我想在page.ts中编写一个函数来停止此循环。如何终止待处理的获取请求？

无效的解决方案 我试图在page.ts：

中保留一个指向可观察对象的指针

export class Page {
    ...
    join_channel: any;
  join(){
    this.join_channel = this.myProvider.join().subscribe(
        (data)=>{
            ...
                this.join();
            ...

然后我通过调用this.join_channel.unsubscribe()我想关闭请求，所以在我的情况下：

  ionViewWillLeave() {
    this.join_channel.unsubscribe();
    delete this;
  }

但即使通过取消订阅，获取请求仍然存在待决状态;因此，当我尝试再次在我的页面中输入时，新的join()在第一步无法接收http.get响应，因为之前的请求将使用该答案仍然未决。

Answer 1

使用rxjs的超时

this.http.get(API)
    .timeout(2000)
    .map(res => res.json()).subscribe((data) => {
      return data;
    },
      (err) => {
        return err;
      }
    );

不要忘记导入import 'rxjs/add/operator/timeout';

Answer 2

如果您使用的是angular 6，则必须使用

pipe（timeout（2000））

this.http.get(API)
    .pipe(timeout(2000))
    .map(res => res.json()).subscribe((data) => {
      return data;
    },
      (err) => {
        return err;
      }
    );

Ionic 2：停止http请求

2 个答案: