web-dev-qa-db-ja.com

RXJSで2分ごとにHTTP呼び出しを行う方法

2分ごとに休憩サービスを呼び出すサービスがあります。私のサービスには次の機能があります

  getNotifications(token: string) {
     const body = 'xxxxxxxxx=' + token;
     return this.http.post('/rest/ssss/ddddddd/notificationcount', body, this.options)
          .map((res) => res.json());
  }

コンポーネントでは、サービス関数を呼び出してAPIを呼び出します。

this.notificationService.getNotifications(this.token).subscribe((data) => {
  console.log(data);
});

この呼び出しを2分ごとに行いたいのですが、これを行う最良の方法は何ですか?

11
Ennio

既にObservablesを使用しているので、単にそれを最大限に活用してください:) Obersvable.interval()はここであなたの良い友達です:

コンポーネントで、これを実行します。

_Observable
    .interval(2*60*1000)
    .timeInterval()
    .flatMap(() => this.notificationService.getNotifications(this.token))
    .subscribe(data => {
        console.log(data);
    });
_

説明:

  1. .interval()は、2分ごとにイベントを発行するオブザーバブルを作成します。
  2. .timeInterval()は、アイテムを放出するObservableを、それらの放出の間に経過した時間の指示を放出するものに変換します。
  3. .flatMap()は、サービス呼び出しのeach and everyをラップし、結果をオブザーバブルに変換して返します。これにより、0、2、4、6 ....分のサービスコールが同期的に呼び出されます。 (多くの.then()があると考えてください)、つまり、2分目のサービスは0分目の呼び出し後にのみ呼び出され、4分目の呼び出しは2分後にのみ呼び出されます。
  4. .subscribe()最後に、データをサブスクライブできます

更新:

パイプ可能な演算子(rxjs5以降)を使用している場合、演算子をチェーンするのではなく単純にパイプします。

_interval(2 * 60 * 1000)
    .pipe(
        flatMap(() => this.notificationService.getNotifications(this.token))
    )
    .subscribe(data => console.log(data))
_
30
CozyAzure

Http呼び出しを行いたくないが、2分後に何かをしたい場合は、次のようなことができます。

 Observable.interval(2*60*1000)
  .subscribe(() => {
    // do something.
    // or callSomeMethod();
  });

もう1つ重要なことがあります。現在のページを離れると、このオブザーバブルを破棄する必要があります。これらが実際に必要ない場合は、背後で余分な計算を実行したくないためです。

このオブザーバブルの登録を解除するには、複数のオプションがあります。

  1. オブザーバブルへの参照を保存し、onDestroyメソッドでサブスクライブを解除する必要があります。

    this.observableRef = Observable.interval(60000)
    .subscribe(() => {
      // do something
     });
    
    // call this method in OnDestroy method of the page.
    this.observableRef.unsubscribe();
    
  2. または ngx-take-until-destroy を使用します

    Observable.interval(60000)
    .takeUntil(this.destroyed$)
    .subscribe(() => {
      //  do something
    });
    
1
Atif Saddique

RxJs 6+を使用している場合は、単にintervalメソッドを使用して実行できます。このような -

import { interval } from 'rxjs';

interval(3000).subscribe(x => /* do something */)
0
Pardeep Jain
import {Observable} from 'rxjs/Rx';

  Observable.interval(2 * 60 * 1000).subscribe(x => {
    callyourmethod();
  });

コメント後に更新

this.interval = setInterval(() => {
        this.yourservicecallmethod();
    }, 2 * 60 * 1000);
0
Rahul Singh