0
Help us understand the problem. What are the problem?

posted at

NestJSでHTTPリクエストを取り扱う

NestJSの中でHTTPリクエストを投げたり、結果を取得したりする方法をまとめます。

前提

  • NestJS
  • TypeScript

リクエストを投げる

サービス内でHTTPリクエストを投げる場合は、HTTPServiceを使えば大丈夫です。

//////////////////////////////////////////////////////////////////////////
//  このコードは意図した通りに動きません!
//////////////////////////////////////////////////////////////////////////
import { HttpService } from '@nestjs/axios';

@Injectable()
export class HogeService {
  constructor(
    private httpService: HttpService,
  ) {}

  async GetData() {
    // ※これは期待通りにならない
    const result = await this.httpService.get("http://www.example.com/");
  }
}

上のコードは意図した通りに動きません。
その理由は、httpService.get()Observableを返すので、一般的なaxiosの使い方とは違う方法が必要なためです。
image.png

Observableはリアクティブプログラミングで用いられる用語です。

リアクティブプログラミング

ストリームと呼ばれるデータの流れを扱います。

  • pipe: データを受け取ったときの処理を書く
    • map: 新しい値を返す
  • lastValueFrom:最後の値を取得(ObservableからPromiseに変換)

toPromise()を使うサンプルコードもありますが、現在は非推奨です。

意図した通り動くコード

リアクティブプログラミングを意識して書く必要があります。

import { HttpService } from '@nestjs/axios';

@Injectable()
export class HogeService {
  constructor(
    private httpService: HttpService,
  ) {}

  async GetData() {
    const result = await lastValueFrom(  // ObservableをPromiseに変換して最後の値を取得。
      this.httpService
        .get("http://www.example.com/")
        .pipe(map((response) => response.data)),  // pipe()でデータ取得時の処理を記述。mapで取得した内容のうちdataを返す
    );
  }
}

まとめ

NestJSのHTTPServiceではリアクティブプログラミングを意識したコードを書く必要があります。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
0
Help us understand the problem. What are the problem?