web-dev-qa-db-ja.com

angular）でオブザーバブルを返すHttpClientリクエストをサブスクライブしないとどうなりますか

私はAngular＆TypeScriptに不慣れで、理解しようとしていますHttpClient、observables＆subscribe

コンポーネントの関数でこれを行うとき

_console.log(this.http.get('assets/user.json'));
_

オブジェクトを受信して​​いますが、コードをに変更すると、デバッガーnetworkで_https://localhost:4200/assets/user.json_に送信されるリクエストを確認できません。

_this.http.get('assets/userDetail.json').subscribe(data => this.user = { name:  data['name']});
_

ネットワークリクエストが必要なURLにヒットしているのがわかります。なぜこれが起こっているのですか？私の理解では、応答データストリームをサブスクライブしなくても、this.http.get('assets/userDetail.json')はURLにヒットします。

angulartypescriptrxjsobservableangular-httpclient
7
Kuldeep Dangi

問題を理解するには、hot＆coldのオブザーバブルがあることを知っておくとよいでしょう。 -コールドはサブスクライブする必要があります。そうしないと、それらは起動されません。ホットは、何かがサブスクライブされているかどうかに関係なく起動されます。

AngularのHttpClientはコールドObservableを返すため、サブスクライブするまで起動されません。オブザーバブルがホットかコールドかを確認するには、対応するドキュメントを確認する必要があります。たとえば、 HttpClient.post ：を参照してください。

Observableを構築します。これにより、サブスクライブすると、構成されたPOSTリクエストがサーバー上で実行されます。

Angularのホットオブザーバブルの例は次のとおりです。 ActivatedRoute.params-使用方法 -サブスクリプションがないことがわかります。

オブザーバブルがホット/コールドであるという事実は、単にサブスクライブする必要があるかどうかよりも多くの結果をもたらします。

23
Tomas Varga

前の回答は、サブスクライバーなしでは機能しない理由をすでに説明しています。 コールドオブザーバーであるため、少なくとも1つのサブスクライバーが見つかった場合にのみ実行されます。

したがって、代替手段は基本的に次のとおりです。

 this.http.get('assets/user.json').subscribe();
0
winter

そのようなコードを想定し、冷たく観察できることを言及する価値があります：

（擬似コード）

コンポーネント：

ngOnInit(): void {
    console.log('Before, in ngInit')
    usersService.usersGet();
    console.log('After, in ngInit')
}

サービス：

public usersGet(){
   console.log("I'm in service");
   let data = this.http.get('assets/user.json')
   console.log("I'm already here")
   return data;
}

ブラウザの開発ツールにそのような出力が表示されます。

enter image description here

ただし、バックエンドエンドポイントはリクエストを受信しません。

コードを次のように変更すると、バックエンドはリクエストを考慮します。

ngOnInit(): void {
    console.log('Before, in ngInit')
    usersService.usersGet().subscribe( x=> {
        console.log("I'm inside of subscribe")
        console.log(x)
    });
    console.log('After, in ngInit')
}

出力は次のようになります。

enter image description here

0
Reven